I have a friend, mrOverAbsolute, who wants to sit on top of another friend, mrAbsolute. Nobody seems to be complaining. I have another friend who responds to "mrHover" who wants to use a sprite. mrHover is only happy when large dogs, mrHover and mrOverHover are not so absolute.
Here's the drama:
<style>
div#mrOverAbsolute
{
z-index:1;
}
div#mrAbsolute
{
position:absolute;
z-index:-1;
}
a.mrHover
{
background:url('mrImage') 0 0;
}
a.mrHover:hover
{
background-position:0 25;
}
</style>
<div id="mrOverAbsolute"></div>
<div id="mrAbsolute">
<table>
<tr>
<td><a href="" class="mrHover"></a></td>
</tr>
</table>
</div>
Good, good - friends aside - if I delete the "position: absolute", the sprite works. Otherwise, Chrome ignores the fact that I declared ": hover" in CSS.
Any suggestions?
source
share