Hola,
Tengo un problema con un menú desplegable sencillito que estoy montando con CSS y no doy con el error. He probado mil y un cambios y sigo sin dar con el error.
Resulta que el problema solo es visible en Internet Explorer (y en Opera), ya que tanto en Safari como en Firefox funciona perfectamente. El problema es este: cuando pongo el cursor sobre el botón que despliega el menú, este aparece sin problemas, apareciendo el submenú. Pero entre los botones del menú aparece una linea de 1px (que no está definida en ninguna regla CSS) que al pasar por encima hace que el menú se cierre como si hubiese llevado el cursor fuera del menú.
Supongo que el error será obvio, pero yo no doy con él, y me confunde el hecho de que esa linea inexistente solo aparezca en IE y Opera.
Os paso el código HTML y CSS, que como vereis, es de lo mas básico:
Cita:
Iniciado por HTML <ul>
<li><a href="index.html">home</a></li>
<li><a href="nosotros.html">opcion1</a></li>
<li><a href="servicios.html">opcion2</a>
<ul>
<li><a href="marcas.html">subopcion1</a></li>
<li><a href="marketing.html">subopcion2</a></li>
<li><a href="grafica.html">subopcion3</a></li>
<li><a href="interactiva.html">subopcion4</a></li>
</ul>
</li>
<li><a href="noticias.html">opcion3</a></li>
<li><a href="trabaja-con-nosotros.html">opcion4</a></li>
<li><a href="contacto.html">opcion5</a></li>
</ul>
Cita:
Iniciado por CSS ul {
list-style-type: none;
display: block;
}
li {
display: block;
float: left;
}
li ul {
display: none;
}
ul li a {
display: block;
width: 130px;
text-align: center;
text-decoration: none;
font-size: 13px;
font-variant: small-caps;
color: #666666;
margin-left: 1px;
white-space: nowrap;
height: 22px;
}
ul li a:hover {
color: #003A83;
background-image: url(img/arrow.png);
background-position: center 15px;
background-repeat: no-repeat;
}
li:hover ul {
display: block;
position: absolute;
}
li:hover li {
float: none;
}
li:hover a {
background-color: #FFFFFF;
}
li:hover li a:hover {
background-color: #ffcc00;
}
A ver si conseguís sacarme de este error, que yo no puedo más. :oops:
Gracias y un saludo!