Ver Mensaje Individual
  #1 (permalink)  
Antiguo 01/10/2013, 10:17
Bugger
 
Fecha de Ingreso: septiembre-2010
Ubicación: /home/
Mensajes: 103
Antigüedad: 14 años, 3 meses
Puntos: 17
menu horizontal con efecto hover

hola
mi duda es la siguiente
tengo el siguiente menu:
Código HTML:
<div id="menucontainer">      
        <ul id="menu">
            <li><a href="http://www.forosdelweb.com/f53/menu-horizontal-con-efecto-hover-1075455/...">1</a></li>  
            <li><a href="http://www.forosdelweb.com/f53/menu-horizontal-con-efecto-hover-1075455/...">2</a></li>                   
            <li><a href="http://www.forosdelweb.com/f53/menu-horizontal-con-efecto-hover-1075455/...">3</a></li>                                                    
            <li><a href="http://www.forosdelweb.com/f53/menu-horizontal-con-efecto-hover-1075455/...">4</a></li>  
        </ul>
    </div> 
y el siguiente CSS:
Código:
#menucontainer
{
    display: block;
    float: left;
    width: 100%;
    background-color: #00417C;
}
ul#menu
{
    display: block;
    padding: 0px 0px 0px 10px;
}
ul#menu li
{
    display: inline;
    padding: 3px;
    margin: 0 !important;
}
ul#menu li a
{
  color: #ffffff;
  font: 13px Tahoma, Arial, sans-serif;
  letter-spacing: 1px;
  text-decoration: none;
}
ul#menu li:hover 
{
 background-color: #ffffff;
}
el menú no es nada más que un barra horizontal que ocupa todo el ancho de la web con un color de fondo distinto y varios links en ella, que cuando pasas por encima de ellos se 'iluminan'.
el problema lo tengo en que solo se 'ilumina' lo que seria el elemento 'li', que ya es correcto, pero me gustaría que el efecto ocupara todo el alto de distinto color que tiene de fondo el div menucontainer.
en donde me estoy equivocando?

saludos y gracias de antemano