El problema está, como casi siempre, en la mala interpretación de Internet Explorer, ¿por que? muy sencillo:
Código:
ul li:hover { list-style-image: url(img/arrow.png); }
Aquí estamos definiendo la propiedad de li con una imagen a su izquierda personalizada, en vez del punto por defecto.
Según las normas de w3c estamos cambiando la propiedad al tag correcto 'li', sin embargo esto, a pesar de funcionar perfectamente en todos los navegadores (Chrome, Firefox, Safari y Opera entre otros), no funciona en nuestro fantástico IE, ¿por que? por que si tienes un vínculo dentro de ese elemento 'li' este solamente funcionará si haces:
Código:
ul li a:hover { list-style-image: url(img/arrow.png); }
Asignando una propiedad no válida al tag 'a' (en este caso), curiosamente esto no funciona en los demás navegadores, solo en Internet Explorer, por lo que se demuestra una vez mas que si haces las cosas mal, donde tienen que funcionar bien no lo harán, caso contrario de IE, que funciona todo bien cuanto mas mal lo hagas.
Para solucionarlo tendrás que poner los 2 métodos para que los usuarios del malísimo IE puedan ver la imagen personalizada, no hay otra:
Código:
ul li:hover, ul li a:hover {
list-style-image: url(img/arrow.png);
}
Saludos