Foros del Web » Creando para Internet » CSS »

Listas en CSS con Internet Explorer

Estas en el tema de Listas en CSS con Internet Explorer en el foro de CSS en Foros del Web. 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 ...
  #1 (permalink)  
Antiguo 14/03/2005, 16:19
Avatar de Tximis  
Fecha de Ingreso: junio-2004
Ubicación: Bilbao
Mensajes: 328
Antigüedad: 13 años, 6 meses
Puntos: 2
Listas en CSS con Internet Explorer

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
  #2 (permalink)  
Antiguo 14/03/2005, 16:50
 
Fecha de Ingreso: febrero-2005
Ubicación: En un BLINK
Mensajes: 184
Antigüedad: 12 años, 10 meses
Puntos: 0
Internet Explorer sólo soporta :hover en elementos con A que incluyen el atributo href
  #3 (permalink)  
Antiguo 14/03/2005, 16:53
 
Fecha de Ingreso: enero-2003
Ubicación: Córdoba, Argentina
Mensajes: 1.047
Antigüedad: 14 años, 10 meses
Puntos: 10
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....
__________________
oohh... quisiera ser godines!!!

Última edición por safe; 14/03/2005 a las 16:56
  #4 (permalink)  
Antiguo 14/03/2005, 17:12
 
Fecha de Ingreso: febrero-2005
Ubicación: En un BLINK
Mensajes: 184
Antigüedad: 12 años, 10 meses
Puntos: 0
Me temo que debo insistir: A menos que le agregues el atributo href (aunque esté vacio) no va a funcionar en IE.
  #5 (permalink)  
Antiguo 14/03/2005, 17:21
Avatar de Tximis  
Fecha de Ingreso: junio-2004
Ubicación: Bilbao
Mensajes: 328
Antigüedad: 13 años, 6 meses
Puntos: 2
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!
  #6 (permalink)  
Antiguo 14/03/2005, 17:23
Avatar de Tximis  
Fecha de Ingreso: junio-2004
Ubicación: Bilbao
Mensajes: 328
Antigüedad: 13 años, 6 meses
Puntos: 2
Cita:
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
  #7 (permalink)  
Antiguo 14/03/2005, 21:37
 
Fecha de Ingreso: enero-2005
Mensajes: 265
Antigüedad: 12 años, 11 meses
Puntos: 1
Te contesté en los foros de alzado, por si acaso: http://www.xs4all.nl/~peterned/csshover.html
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 16:59.