Gracias Jaume, ya me conocía estos sitios. Pero muchas gracias. A ver, otra cosa. El menú es horizontal, que en el cuerpo del mensaje decía lo contrario, jeje.
Y bueno, llevará javascript. Pero me preocupa que con la posición absoluta dependo del contenido anterior. Yo lo que quiero es que la lista anidada siempre se coloque debajo de la padre, independientemente de lo que haya antes. > Date: Tue, 16 Oct 2007 16:16:59 +0200 > From: [EMAIL PROTECTED] > To: ovillo@lists.ovillo.org > Subject: Re: [Ovillo] menú de listas anidadas en horizontal > > Hola hugo, no se si entiendo todo bien, quieres un menu se desplieble solo > con css "jodidillo" pero mira a ver estos links que tenia a mano > ://www.htmldog.com/articles/suckerfish/example/<http://www.htmldog.com/articles/suckerfish/example/> > <http://www.htmldog.com/articles/suckerfish/example/><http://www.htmldog.com/articles/suckerfish/example/> > http://www.cssplay.co.uk/menus/flyout5.html > solo has de estudiar un poco el codigo y asentarlo a tu gusto. > > Jaume > > 2007/10/16, hugo sierra <[EMAIL PROTECTED]>: > > > > > > Hola a todos: > > > > Estoy haciendo un menú vertical con 2 niveles. Por lo tanto estoy usando > > listas anidadas. > > Pero no consigo controlar la posición de la lista-hija. La posición es > > absoluta y en cuanto falta o se añade algún elemento en algún componente > > anterior, se descoloca. > > > > Yo lo que quiero es que siempre esté ahí. > > > > Si no le pongo position:absolute; más o menos se queda bien pero el <li> > > padre se hace tan grande como la ul que anida. > > > > Bueno este es el CSS para ver si me podeis echar una mano: > > > > #pestanias { > > background-image: url(fondos/pestanias.gif); > > background-repeat: repeat-x; > > background-position: left top; > > height: 58px; > > width: auto; > > } > > > > #pestanias ul{ > > margin:0; > > list-style:none; > > padding: 8px 10px 0px 10px; > > } > > > > #pestanias ul li{ > > display:inline; > > float: left; > > margin: 0; > > > > } > > > > #pestanias ul li a{ > > font-weight: bold; > > color: #3F3E41; > > font-size: 0.9em; > > background-color: #E0DFDF; > > background-image: url(fondos/bot_menu.gif); > > background-repeat: repeat-x; > > background-position: left top; > > display: block; > > padding: 5px 7px; > > border-top: 1px solid #696969; > > border-right:1px solid #696969; > > border-left: 1px solid #696969; > > } > > #pestanias ul li a:hover{ > > background-image: url(fondos/bot_menu_sobre.gif); > > background-repeat: repeat-x; > > background-position: left top; > > } > > #pestanias ul li ul{ > > background:none; > > list-style:none; > > margin-top:0px; > > position: absolute; > > left: 3px; > > top:172px!important; > > top:180px; > > width: auto; > > padding-top:15px; > > > > } > > > > #pestanias ul li ul li{ > > padding: 0px 2px; > > } > > #pestanias ul li ul li a.activo{ > > border:none; > > float: left; > > display: inline; > > background-color:transparent; > > background-image: url(fondos/bullet_submenu.gif); > > background-repeat: no-repeat; > > background-position: 0px 9px; > > padding-left: 11px; > > > > } > > #pestanias ul li ul li a:hover{ > > color: #A4020B; > > background-image: url(fondos/bullet_submenu2.gif); > > background-repeat: no-repeat; > > background-position: 0px 9px; > > padding-left: 11px; > > } > > > > > > #pestanias ul li a.activo { > > background-image: url(fondos/bot_menu_sobre.gif); > > background-repeat: repeat-x; > > background-position: left top; > > } > > > > > > Muchísimas gracias de antemano. > > > > > > > > _________________________________________________________________ > > Express yourself instantly with MSN Messenger! Download today it's FREE! > > http://messenger.msn.click-url.com/go/onm00200471ave/direct/01/ > > _______________________________________________ > > 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://lists.ovillo.org/mailman/listinfo/ovillo > > > _______________________________________________ > 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://lists.ovillo.org/mailman/listinfo/ovillo _________________________________________________________________ Express yourself instantly with MSN Messenger! Download today it's FREE! http://messenger.msn.click-url.com/go/onm00200471ave/direct/01/ _______________________________________________ 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://lists.ovillo.org/mailman/listinfo/ovillo
