como mostrar imagenes al centro en un menu horizontal

[esaenz22]

buenas noches. estoy implementando un menu horizontal css. en los texto del menu hay imagenes al centro como el que estoy desarrollando.

http://img222.imageshack.us/img222/7...aloriginal.jpg

aqui muestro mi codigo css.

Código CSS:

div#menu ul{
    margin:0;
    padding:0;
    list-style:none;
}
 
/* sufijos 
-top (superior), right (derecha), -bottom (inferior), left (izquierda): */
div#menu li{
    float:left;
    font-family:Arial, Helvetica, sans-serif;
    font-size:13px;
    width:107px;
    height:39px;
    text-align:center;
    padding-top:10px;
    background:url(../imagenes/icono-menu.gif) no-repeat 0px;   
}
 
div#menu li a{
    color:#FFF;
    text-decoration:none;
    padding:0 10px 0 10px;
    width:107px;    
}
 
div#menu li a:hover{
    color:#ffd06d;
}
 

y el html del menu.

Código HTML:

<div id="contenedor">
  <div id="menu">
    <ul>
      <li><a href="#" title="home">home</a></li>
      <li><a href="#" title="nosotros">nosotros</a></li>
      <li><a href="#" title="cartas">cartas</a></li>
      <li><a href="#" title="prensa">prensa</a></li>
      <li><a href="#" title="eventos">eventos</a></li>
      <li><a href="#" title="sense lounge">sense lounge</a></li>
      <li><a href="#" title="contacto">contacto</a></li>
    </ul>
  </div>
</div>
 

la tipografia es lo de menus. lo que me interesa mas es como colocar las imagenes al centro.

les agradeceria si me ayudan con el menu que estoy desarrollando.

saludos.