Iconos en menu horizontal

[leaicp]

Hola a todos!!!! tengo el siguiente problema y luego de una semana sin poder solucionarlo ya me estoy volviendo locoooo El tema es el siguiente:

Quiero hacer una barra horizontal que mida 779px por 39px de altura, con una imagen de fondo (bg_login.gif) que mide 1px por 39px. A su vez esta barra quiero que contenga de 3 botones (en el medio).

Los botonoes son imagenes (30px por 39px). Cada uno tiene dos imagenes (para rollover, solo imagenes sin texto, serían como iconos). Encontre la siguiente css, y si bien el efecto rollover se realiza perfectamente, la imagenes me aparecen una abajo de la otra (verticalmente) y no una al lado de la otra como quiero yo.

Intente cambiando el atributo display: block; por inline. Tambien poniendo mas columnas o con la etiqueta div. Pero tampoco funciona. Creo que el problema es el display: block; pero ya nose como solucionarlo.

Les pego el css y html que tengo. Espero desesperadamente su ayuda. chauuuuu

Código:

<style>
a#yaprak{ width: 30px; height: 39px;
background-image: url(imagenes/btn_homepage.gif);
text-decoration: none; display: block; }
a#yaprak:hover{ background-image: url(imagenes/btn_homepage_on.gif); }

a#yaprak2{ width: 30px; height: 39px;
background-image: url(imagenes/btn_email.gif); 
text-decoration: none; display: block; }
a#yaprak2:hover{ background-image: url(imagenes/btn_email_on.gif); }

a#yaprak3{ width: 30px; height: 39px;
background-image: url(imagenes/btn_favorites.gif); 
text-decoration: none; display: block; }
a#yaprak3:hover{ background-image: url(imagenes/btn_favorites_on.gif); }
</style>

Código:

<table width="779" height="39" background="imagenes/bg_login.gif" align="center" cellpadding="0" cellspacing="0">
<tr>
<td height="39" align="center"><a href="#" id="yaprak">&nbsp;</a><a href="#" id="yaprak2">&nbsp;</a><a href="#" id="yaprak3">&nbsp;</a></td>
</tr>
</table>

[Flora]

Prueba con un float:left