z-index property does not cause overlap in IE8

Tilburg.013

New Member
\[code\].thumbnail:hover{ background-color: transparent; z-index: 1;}\[/code\]I have specified this style to make an image overlap another image on mouse hover. It works perfectly in all other browsers except in IE8. I tried specifying higher value for z-index but it did not work out!This is the complete styles associated with the thumbnails\[code\].thumbnail { position: relative; z-index: 0;}.thumbnail:hover { background-color: transparent; z-index: 50;}.thumbnail span { position: absolute; background-color: lightyellow; padding: 5px; right: -500px; border: 1px dashed gray; visibility: hidden; color: black; text-decoration: none;}.thumbnail span img { border-width: 0; padding: 2px; width: 400px; height: 300px;}.thumbnail:hover span { visibility: visible; top: 0; right: -290px; vertical-align: top;} The HTML part for the CSS is mentioned below : <a id="aPhotos" href="http://stackoverflow.com/questions/3733218/SubscribersPropertyDetail.aspx" class="thumbnail" runat="server"> <img id="imgPhotos" border="0" height='130' width='150' title='Click to view full details about this property' runat="server" /> <span id="spanZoom" runat="server"> <img id="imgzoomphotos" src='http://stackoverflow.com/questions/3733218/~/images/PropertyImages/NoImage.jpg' runat="server" /></span> </a> \[/code\]
 
Top