1 reply [Last post]
alice24springs
Offline
newbie
Utrecht
Last seen: 2 years 27 weeks ago
Utrecht
Timezone: GMT+2
Joined: 2011-10-07
Posts: 4
Points: 6

I'm using image sprites in the menu on this site:

http://www.ekadaksha.webpolish.nl

In ie 7 and earlier versions of ie8 it doesn't work like it should work.

The home button is repeated where the other images should be. The hover and active state are working fine.

This is the css for the menu:
/*MENU*/
#menu {
clear:both;
}
#inmenu {
height:69px;
padding-left:10px;
}
#inmenu ul li {
float: left;
list-style-type: none;
}
#inmenu ul li a {
background: transparent url(../images/menu.gif) no-repeat;
display: block;
height:69px;
overflow: hidden;
text-align:center;
text-decoration:none;
text-indent:-9999px;
width:190px;
}
/* normal */
#inmenu li.item1 a:link {
background-position:0 -71px;
}
#inmenu li.item31 a:link {
background-position:-195px -71px;
}
#inmenu li.item3 a:link {
background-position:-390px -71px;
}
#inmenu li.item4 a:link {
background-position:-585px -71px;
}
#inmenu li.item5 a:link {
background-position:-780px -71px;
}
/*hover, active & current*/
#inmenu li.item1 a:hover,
#inmenu li.item1.active a,
#inmenu #current.item1 a {
background-position:0 1px;
}
#inmenu li.item31 a:hover,
#inmenu li.item31.active a,
#inmenu #current.item31 a {
background-position:-195px 1px;
}
#inmenu li.item3 a:hover,
#inmenu li.item3.active a ,
#inmenu #current.item3 a {
background-position:-390px 1px;
}
#inmenu li.item4 a:hover,
#inmenu li.item4.active a,
#inmenu #current.item4 a {
background-position:-585px 1px;
}
#inmenu li.item5 a:hover,
#inmenu li.item5.active a,
#inmenu #current.item5 a {
background-position:-780px 1px;
}

Attached an image of what it looks like in ie7

Is it about positioning? Why does the hover etc. work? And not the rest

Thanks

AttachmentSize
Schermafbeelding 2011-10-08 om 10.20.06.JPG29.49 KB
alice24springs
Offline
newbie
Utrecht
Last seen: 2 years 27 weeks ago
Utrecht
Timezone: GMT+2
Joined: 2011-10-07
Posts: 4
Points: 6

Solution was to change the normal state

After changing the normal state to #inmenu li.item1 a everything was solved. It now works in all versions. Still I'm wondering why I had to change this from ... a:link to a