Hola a tod@s, estoy probado este trozo de css:
Código HTML:
.ES #menu_horizontal ul li a{background:url(../img/menu_h_ES.jpg) top left no-repeat; float:left; display:block; text-align:center; height:30px; width:100%; padding:0px 18px; }
.ES #menu_horizontal ul li a.quien{background-position: 0px 0px; width:124px;}
.ES #menu_horizontal ul li a:hover.quien, .ES #menu_horizontal ul li a.quien.checked{background-position: 0px -30px;}
.ES #menu_horizontal ul li a.contacto{background-position: -160px 0px; width:63px;}
.ES #menu_horizontal ul li a:hover.contacto, .ES #menu_horizontal ul li a.contacto.checked{background-position: -160px -30px;}
Como ven, a parte de mover la imagen que previamente cargo en las a de este listado, hago que cuando añado la clase checked, tenga el mismo efecto que cuando se hace rollOver.
Esto me funciona en ie7, y FF2 y FF3, pero en IE6 no me hace caso, me deja como checked el ultimo elemento que halla en el css, en este caso si yo pongo checked en el div correspondiente a la clase .quien me dejaria el background con las coordenadas de la clase .contacto
¿Alguien sabe porque lo hace?