El título resume lo que sucede paso al código:
Probé con diferente orden y tampoco funciona.
Me olvidaba, es un sprite con css e imagenes.
Código CSS:
Ver original
#navbar { margin: 20px 0; line-height: 6em; overflow: hidden; } #navbar ul { float: right; margin: 0; vertical-align: middle;} #navbar ul li { display: inline; text-decoration: none; height: 1%; overflow: hidden; } #navbar ul li a { margin-left: 0px; text-align: center; } #navbar a { display: block; background-image: url(img/nav-index.png); background-repeat: no-repeat; float: left; text-indent: -9999px; height: 100px; margin-right: 0px; } #navbar a#nav_live:LINK { width: 160px; background-position: 0px 0px; } #navbar a#nav_live:VISITED { background-position: 0px -100px; }#navbarsec a.nav_barrio:VISITED { background-position: -100px -100px; } #navbar a#nav_live:HOVER { background-position: 0px -100px; } #navbar a#nav_barrio { width: 182px; background-position: -130px 0px; } #navbar a#nav_barrio:hover { background-position: -130px -100px; } #navbar a#nav_amenities { width: 183px; background-position: -300px 0px; } #navbar a#nav_amenities:hover { background-position: -300px -100px; } #navbar a#nav_planos { width: 183px; background-position: -480px 0px; } #navbar a#nav_planos:hover { background-position: -480px -100px; } #navbar a#nav_news { width: 182px; background-position: -650px 0px; } #navbar a#nav_news:hover { background-position: -650px -100px; } #navbar a#nav_etapauno { width: 70px; background-position: -850px 0px; } #navbar a#nav_etapauno:hover { background-position: -850px -100px; }