Aligner <div> éléments côte à côte

Question

Je sais que c'est plutôt une question simple, mais je ne peux pas la comprendre pour la vie de moi. J'ai deux liens que j'ai appliqué une image de fond. Voici à quoi il ressemble actuellement (toutes mes excuses pour l'ombre, juste un croquis d'un bouton):

Cependant, je veux que ces deux boutons à côté de l'autre. Je ne peux pas vraiment comprendre ce qui doit être fait avec l'alignement.

Voici le code HTML

<div id="dB"}>
    <a href="http://notareallink.com" 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>

Voici le 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;
}

Answer 1

Une autre solution est d'utiliser display: inline-block pour chacun des divs

Answer 2

S'appliquent float:left; pour les deux divs devrait les faire se côtoient.