On 3/17/06, Federico MP <[EMAIL PROTECTED]> wrote:
>
> De http://www.estandaresweb.es/pruebas/menu.html
>
> li ul { display: none; width: 80px; }
> li:hover ul, li.over ul { display: inline; }
>
> Si UL va a ser inline, el width está de más. ;)
Estube mirando y pensando lo que comentas ...
Segun el codigo inicial:
ul { list-style: none; margin:0; padding:0; width:300px;}
ul li { display: inline; }
li ul { display: none; }
a { text-decoration: none; color: blue; }
li:hover ul, li.over ul { display: inline; }
Fijate que la primera linea dice que todos los "ul" tienen un ancho de
"300px", y además digo que los "li" tiene un comportamiento inline (linea 2)
¿Porque ese codigo hace que el explorer salte la linea y coloque la segundo
lista de elementos debajo?
A mi entender, porque tenemos una lista dentro de la otra, ambas con un
width de "300px", pero los "300px" de la segunda lista no caben dentro de la
primera, de ahi que el Explorer haga el salto.
Visto esto inconscientemente hice el siguiente codigo:
ul { list-style: none; margin:0; padding:0; width:300px;}
ul li { display: inline; }
li ul { display: none; width: 80px; }
a { text-decoration: none; color: blue; }
li:hover ul, li.over ul { display: inline; }
Como se puede ver, reduzco el ancho de la segunda lista, y ahora si cabe
todo dentro de los 300 px. Es decir, estoy redefiniendo el width de la
primera linea. Y asi finalmente se visualiza bien en I.Explorer.
Pero no queda ahi, si eliminamos los width y dejamos que sean "auto", todo
funciona tambien correctamente, quedandonos el siguiente codigo:
ul { list-style: none; margin:0; padding:0; }
ul li { display: inline; }
li ul { display: none; }
a { text-decoration: none; color: blue; }
li:hover ul, li.over ul { display: inline; }
Se puede ver todo mas claro en:
http://www.estandaresweb.es/pruebas/menu.html
Saludos !
--
> Federico MP
> http://511.dabomb.com.ar
> _______________________________________________
> Lista de distribución Ovillo
> Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
> Puedes modificar tus datos o desuscribirte en la siguiente dirección:
> http://ovillo.org/mailman/listinfo/ovillo
>
--
David Castelló
www.estandaresweb.es
_______________________________________________
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://ovillo.org/mailman/listinfo/ovillo
