Tengo un menu creado con hojas de estilos, un menu recursivo uso <ol> y <li> para generarlo (el menu lo encontre en un tutorial CSS).....
ejemplo:
Código HTML:
<ul id="menu_title" class="menu_title"> <li><a href="http://waska.maborak.org">Página principal</a></li> <li><a href="#">Panel de Control</a></li> <li><a href="#">Configuracion General</a></li> <li><a href="#">Administracion de artículos</a></li> <li><a href="#">Bloques</a> <ul id="menu_title" class="menu_title"> <li><a href="#">Panel de Control</a></li> <li><a href="#">Configuracion General</a></li> <li><a href="#">Administracion de artículos</a></li> <li><a href="#">Bloques</a></li> <li><a href="#">Modulos</a></li> <li><a href="#">Usuarios</a></li> <li><a href="#">Salir</a></li> </ul> </li> <li><a href="#">Modulos</a></li> <li><a href="#">Usuarios</a></li> <li><a href="#">Salir</a></li> </ul>
esta es la hoja de estilos.
Código HTML:
.menu_title { margin: 0; padding: 0; z-index:2; list-style: none; width: 100%; /* Width of Menu Items */ border-bottom: 1px solid #DBE0E5; } .menu_admin_content { font-size:11px; } .menu_admin_content .menu_title li a{color:#000000;} /*IE Hack link*/ .menu_title li { position:relative; } .menu_title li a { display: block; text-decoration: none; color: #000000; background: #fafbfc; /* IE6 Bug */ padding: 5px; border: 1px solid #DBE0E5; border-bottom: 0; } /* Fix IE. Hide from IE Mac */ * html ul li { float: left; height: 1%; } * html ul li a { height: 1%; color:#000000;} /* End */ .menu_title li a:hover { color: #666666; background: #ffffff; } .menu_title ul { position:absolute; z-index:3; display:none; left: 80%; top: 20%; } .menu_title li ul li a { padding: 5px; } .menu_title li:hover ul ul, li.over ul ul, .menu_title li:hover ul ul ul .menu_title li .menu_title, .menu_title li .menu_title li .menu_title, .menu_title li .menu_title li .menu_title li .menu_title, .menu_title li .menu_title li .menu_title li .menu_title li .menu_title { display:none; } li:hover ul, li li:hover ul, li.over ul, li li.over ul, .menu_title .over .menu_title, .menu_title li li:hover .menu_title, .menu_title li:hover .menu_title, .menu_title li .menu_title li:hover .menu_title, .menu_title li .menu_title li .menu_title li:hover .menu_title { display: block; }
puedo hacer que funcione en IE con un sub menu pero yo quiero que sea hasta el infinito y pufff ... no me lo interpreta!!!
gracias. :)
connection closed.