problema de css con el firefox...

esto es curioso:
estoy haciendo un diseño con css donde hay un par de links con la propiedad display:inline-block que en IE y Opera funcionan a la perfección, pero Firefox ni se entera...

se trata de dos links, uno al lado del otro, a los que les debe cambiar el color de fondo al pasarles el mouse por encima

tengo esto:

Código :

#idioma{ text-align:center; line-height:33px; }

#idioma a{color:#fff; display:inline-block; width:98px; }

#idioma a{background:url(img/bgreen.jpg);}

#idioma a:hover{background:url(img/bgrey.jpg) repeat-x;}

y el html:

Código :

<div id="idioma">
<a href="#">Espa&ntilde;ol</a><a href="#">English</a>
</div>

funciona perfectamente en ie y en opera, pero en firefox nada...
existe algun tipo de hack para firefox, o existe alguna otra forma de lograr lo mismo?

gracias!![/code]

Es que en Firefox no funciona:
http://www.quirksmode.org/css/display.html

Hola, un poco viejo el tema como para revivirlo, pero ya que estamos, puedes hacerlo de este modo:

Código HTML :

<div id='idioma'>
   <ul>
      <li><a href='esp'>Español</a></li>
      <li><a href='eng'>Inglés</a></li>
   </ul>
</div>

Y el CSS:

Código CSS :

ul li {
   list-style: none;
   display: inline;
   padding: 5px;
}
ul li:hover {
   background: #c09;
}
ul li a {
   text-decoration: none;
   color: #000;
}

Saludines!!!