Hola amigos
Tengo un problema con un menú hecho con imágenes, en firefox o cualquier otro navegador se ve así:
Pero en IE6 se ve así:
El código que he usado es:
Código HTML:
<div class="menu">
<a href="index.php" id="empresa"></a>
<a href="noticias.php" id="noticias"></a>
<a href="obras.php" id="obras"></a>
<a href="calidad.php" id="calidad"></a>
<a href="#" id="galeria" class="s"></a>
<a href="prensa.php" id="prensa"></a>
<a href="contacto.php" id="contacto"></a>
</div> [CSS]
.menu{
padding-left:70px;
max-height:120px;
}
.menu a {
display:block;
border:none;
background-repeat:no-repeat;
width:120px;
height:9px;
margin-top:6px;
}
.menu a:hover { background-position: 0 -9px; text-decoration: none; }
.menu .alt { display:none; }
.menu a.s { background-position: 0 -9px; }
.menu a#empresa { background-image: url(../imagenes/empresa.gif) }
.menu a#noticias { background-image: url(../imagenes/noticias.gif) }
.menu a#obras { background-image: url(../imagenes/obras.gif) }
.menu a#calidad { background-image: url(../imagenes/calidad.gif); height:19px; }
.menu a#calidad:hover { background-position: 0 -19px; text-decoration: none; }
.menu a#calidad.s { background-position: 0 -19px; }
.menu a#galeria { background-image: url(../imagenes/galeria.gif) }
.menu a#prensa { background-image: url(../imagenes/prensa.gif) }
.menu a#contacto { background-image: url(../imagenes/contacto.gif) }
[/CSS]
¿Habría alguna forma de arreglarlo?
He probado miles de formas con los CSS pero no hay manera.
Gracias de antemano.
Saludos.