Hola de nuevo.
He conseguido que el menú vertical no modifique al menú horizontal y viceversa y cada uno con sus propiedades tal y como dijiste ahora los submenus del menú vertical no salen paralelos a su menu correspondiente. gracias
estilo css del menú horizontal:
Código:
#menu { font-family:Calibri; height:34px; position:relative; background:#6679d2; -moz-border-radius:10px; -webkit-border-radius:10px; margin: 10px 0;}
#nav { margin:0px; padding:0px; position:absolute; display:block;}
#nav > li { list-style-type:none; float:left; display:block; margin:0px; position:relative; padding:1px; width:40px;}
#nav > li:hover ul { display:block; }
#nav > li:hover { background-color:#3b4d83; -moz-border-radius:10px; -webkit-border-radius:10px; }
#nav li ul { margin:0px; padding:0px; display:none;}
#nav li ul li { list-style-type:none; margin:10px 0 0 0;}
#nav li ul li a { display:block; padding:5px 10px; color:#A2E200; text-decoration:none}
#nav li ul li:hover a { background-color:#606060; -moz-border-radius:10px; -webkit-border-radius:10px;}
#nav li span { cursor:pointer; margin:0px 10px; font-weight:bold; }
a {
color: #000000;
}
a:visited {
color: #000000;
}
a:active {
color: #000000;
}
a:hover {
color: #000000;
}
y menú css horizontal
Código:
<div id="menu">
<ul id="nav" style="left: 3px; top: 5px; height: 51px">
<li style="left: 0px; top: 0px; width: 57px"><span>
<a href="">Inicio</a></span></li>
<li style="left: -8px; top: 0px; width: 81px"><span>
<a href="">Situación</a></span></li>
<li style="left: -15px; top: 0px; width: 108px"><span>
<a href="">Instalaciones</a></span></li>
<li style="left: -20px; top: 0px; width: 142px"><span>
<a href="">Horarios y Cuotas</a></span></li>
<li style="left: -28px; top: 0px; width: 96px"><span>
<a href="">El Maestro</a></span></li>
<li style="left: -36px; top: 0px; width: 105px"><span>
<a href="">Musculación</a></span></li>
<li style="left: -44px; top: 0px; width: 97px"><span>
<a href="">Taekwondo</a></span></li>
<li style="left: -52px; top: -1px; width: 70px"><span>
<a href="">Aeróbic</a></span></li>
<li style="left: -60px; top: 0px; width: 161px"><span>
<a href="">Jeet Kune Do Murcia</a></span></li>
<li style="left: 876px; top: -20px; width: 138px"><span>Otras actividades</span>
<ul>
<li><a href="">Danza del Vientre</a></li>
<li><a href="">Step</a></li>
</ul>
</li>
</div>
estilo css del menú vertical: (edito)
Código:
#mene {margin: 0; padding: 0; list-style: none; width: 211px;}
#nov ul li { position: relative; }
#nov li ul { position: absolute; left: 211px; display: none; }
#nov li a { display: block; text-decoration:none; color: #777; background: transparent; padding: 5px;}
#nov ul { margin: 0; padding: 0; list-style: none; width: 211px; }
#nov ul li {position: relative;}
#nov li:hover ul { display: block; }
.style2 {
font-family: Tahoma;
font-size: small;
}
nota: ahora si sale el sub menú, pero no sale en linea con el menu
menú css vertical:(edito)
Código:
<div id="mene" style="height: 169px">
<ul id="nov">
<li class="style2">Principal</li>
<li class="style2"><a href="#">Artículos y entrevistas</a></li>
<li><span class="style2"><a href="#">Conoce al instructor</a></span>
<ul>
<li><a href="#">Imagenes</a></li>
</ul>
</li>
<li><span class="style2"><a href="#">Jeet Kune Do</a></span>
<ul>
<li><a href="#">Imagenes</a></li>
</ul>
</li><li><span class="style2"><a href="#">Filipino Martial Arts (KALI-ESKRIMA-ARNIS)</a></span>
<ul>
<li><a href="#">Imagenes</a></li>
</ul>
</li><li><span class="style2"><a href="#">Maphilindo Silat & Majapahit Martial Arts</a></span>
<ul>
<li><a href="#">Imagenes</a></li>
</ul>
</li>
</ul>
</div>
nota: he metido el menú en una etiqueta <div>.
repito ahora el problema lo tengo con los submenus del menú vertical que no salen en linea con con el menú (si no, una linea por debajo)