Código HTML:
<div id="menud"> <ul> <li class="level first"> <a href="" class="level">Inicio</a> <!--[if lte IE 6]><a href="" class="levelie">Inicio<table class="false"><tr><td><![endif]--> <ul> <li class="first" ><a href="">Axess</a></li> <li><a href="">once</a> <ul> <li class="first"><a href="">twice</a></li> </ul> </li> </ul> <!--ìf lte IE 6]></td></tr></table></a><![endif]--> </li> <li class="level"> <a href="" class="level">Inicio</a> <!--[if lte IE 6]><a href="" class="levelie">Inicio<table class="false"><tr><td><![endif]--> <ul> <li class="first" ><a href="">Axess</a></li> <li><a href="">once</a></li> </ul> <!--ìf lte IE 6]></td></tr></table></a><![endif]--> </li> </ul> </div>
Código HTML:
#menud{ text-align:center; font-size: 0.8em; width:155px; margin:1px auto; } #menud ul{ list-style-type: none; } #menud ul li.level{ float: left; width: 155px; margin-right:2px; } #menud ul li a{ display:block; text-decoration:none; font-size:17px; color:#000; border:solid 0px #fff; padding:6px; position:relative; } #menud ul li:hover{ position:relative; } #menud ul li a:hover, #menud ul li:hover a.level{ color:#FFF; background-color:#000; border-bottom:2px solid #F00; position:relative; } #menud ul li a.level{ display:block!important; display:none; position: relative; } #menud ul li ul{ display:none; } #menud ul li a:hover ul, #menud ul li:hover ul{ display:block; position: absolute; left:0px; } #menud ul li ul li a{ width:155px; padding:5px 0px 5px 0px; border-top-color:#000; } #menud ul li ul li a:hover{ border-top-color:#000; position:relative; } table.false{ border-collapse:collapse; border:0px; float:left; position: relative; }