Listas en CSS con Internet Explorer

[Tximis]

Buenas,

Estoy haciendo un menu utilizando listas (LI y UL) en CSS, en Mozilla se vé tal y como quiero pero en Internet Explorer no funciona al pasar el ratón por encima de los elementos de las listas, es decir, no se aplican correctamente las propiedas de :hover. No cambia la imagen, ni colores, etc.. en general creo que no se aplica ningún atributo.

He buscado información y no encuentro nada, todas las guias indican que lo estoy haciendo bien.

Dejo aquí el código CSS y HTML por si le quereis echar un vistazo. Muchas gracias por adelantado.

Código CSS

Código:

li{
	list-style: none;
	list-style-image: url(b1.gif);
	background-repeat: no-repeat;
	text-decoration: none;
	color: grey;
	
}

li:hover{
	list-style: none;
	list-style-image: url(b2.gif);
	background-repeat: no-repeat;
	text-decoration: none;
	padding-left: 0px;
	color: white;
}

Código HTML

Código:

<ul>
	<li>Item 1</li>
	<li>Item 2</li>
	<li>Item 3</li>
	<li>Item 4</li>
	<li>Item 5</li>
</ul>

Saludos!

P.D.: La imagen b2.gif si existe, por si a alguien se le ocurre que pueda ser eso

[Remo:Erdosain]

Internet Explorer sólo soporta :hover en elementos con A que incluyen el atributo href

[safe]

bueno.. la verdad yo recien me estoy iniciando en este tema, pero por lo que pude ver lo que tenes que hacer es asignarle los valores que pones pero a una etiqueta <a> dentro de la etiqueta <li>....

li a{
....
}

li a:hover{
....
}
o algo asi, porque lo de :over solo sirve para las etiquetas A.

y despues pones asi:

<ul>
<li><a>algo</a></li>
<li><a>algo</a></li>
<li><a>algo</a></li>
<ul>

No estoy del todo seguro de lo que digo, pero podes probar mientras alguien mas calificado viene en tu ayuda....

[Remo:Erdosain]

Me temo que debo insistir: A menos que le agregues el atributo href (aunque esté vacio) no va a funcionar en IE.

[Tximis]

Buenas,

Gracias por la información, me estaba volviendo loco. Había consultado varios tutoriales y creía que era posible. En este por ejemplo, hacen ver que se puede hacer con CSS tal y como lo estoy haciendo.

He probado con lo que me habeis comentado, pero ahora solo funciona con Internet Explorer, en Moz. Este es el código:

Código:

LI A{
	list-style: none;
	list-style-image: url(b1.gif);
	background-repeat: no-repeat;
	text-decoration: none;
	color: grey;
	
}

LI A:hover{
	list-style: none;
	list-style-image: url(b2.gif);
	background-repeat: no-repeat;
	text-decoration: none;
	padding-left: 0px;
	color: white;
}

Intentando buscar una solución para los dos navegadores se me ha ocurrido hacer lo siguiente y de momento funciona

Código:

LI A{
	list-style: none;
	list-style-image: url(b1.gif);
	background-repeat: no-repeat;
	text-decoration: none;
	color: grey;
	
}

LI A:hover{
	list-style: none;
	list-style-image: url(b2.gif);
	background-repeat: no-repeat;
	text-decoration: none;
	padding-left: 0px;
	color: white;
}


LI {
	list-style: none;
	list-style-image: url(b1.gif);
	background-repeat: no-repeat;
	text-decoration: none;
	color: grey;
	
}

LI:hover{
	list-style: none;
	list-style-image: url(b1.gif);
	background-repeat: no-repeat;
	text-decoration: none;
	color: grey;
	
}

Saludos y muchas gracias!

[Tximis]

Iniciado por Remo:Erdosain

Me temo que debo insistir: A menos que le agregues el atributo href (aunque esté vacio) no va a funcionar en IE.

Cierto, es neceario incluirlo. Gracias por el detalle, me has ahorrado muchas horas de búsquedas

Saludos

[posavasos]

Te contesté en los foros de alzado, por si acaso: http://www.xs4all.nl/~peterned/csshover.html