Выровнять элементы <div> бок о бок

Я знаю, что это довольно простой вопрос, но я не могу понять это для меня. У меня есть две ссылки, на которые я применил фоновое изображение. Вот что он сейчас выглядит (извинения за тень, всего лишь приблизительный эскиз кнопки):

Однако, я хочу, чтобы эти две кнопки были рядом. Я не могу понять, что нужно сделать с выравниванием.

Здесь HTML

<div id="dB"}>
    <a href="#" onclick="location.href='http://notareallink.com'; return false;" title="Download" id="buyButton">Download</a> 
</div>
<div id="gB">
    <a href="#" title="Gallery" onclick="$j('#galleryDiv').toggle('slow');return false;" id="galleryButton">Gallery</a>     
</div>

Здесь CSS

#buyButton {
    background: url("assets/buy.png") 0 0 no-repeat;
    display:block;
    height:80px;
    width:232px;
     text-indent:-9999px;
}
#buyButton:hover{
width: 232px;
height: 80px;
background-position: -232px 0;
}
#buyButton:active {
width: 232px;
height: 80px;
background-position: -464px 0;
}

#galleryButton {
    background: url("images/galleryButton.png") 0 0 no-repeat;
    display:block;
    height:80px;
    width:230px;
     text-indent:-9999px;
}
#galleryButton:hover{
width: 230px;
height: 80px;
background-position: -230px 0;
}
#galleryButton:active {
width: 230px;
height: 80px;
background-position: -460px 0;
}