CSS Sprite 在 IE 中不起作用[8/7/6]答案

【问题标题】：CSS Sprites don't work in IE[8/7/6]CSS Sprite 在 IE 中不起作用[8/7/6]
【发布时间】：2009-02-19 02:00:11
【问题描述】：

我正在尝试使用 CSS 使用 sprite 为我的风险矩阵设置动画……它在 Firefox 和 Chrome 中运行良好，但图像不会在 IE 中显示……

代码在下面，不想把整个东西贴在这里，但摘录显示了模式：

<dl id="rmMap4x4">
<dd id="m4p4s1">
<a onclick="setDropDownListValues(4,1,3,4)" onmouseover="setDropDownListValues(4,1,-1,4)">
</a>
</dd>
<dd id="m4p3s1">
<a onclick="setDropDownListValues(3,1,2,4)" onmouseover="setDropDownListValues(3,1,-1,4)">
</a>
</dd>
...
</dl>

CSS：

dl#rmMap4x4
{
background:  url(/images/RiskMatrix_4x4.png) no-repeat scroll left top;
height: 400px;
margin: 0pt;
padding: 0pt;
position: relative;
width: 400px;
}
/*column 1*/
dd#m4p4s1 a
{
top: 99px;
left: 99px;
}
dd#m4p4s1 a:hover
{
position: absolute;
background:  url(/images/RiskMatrix_4x4.png) -98px -500px no-repeat;
top: 100px;
left: 99px;
}
dd#m4p3s1 a
{
top: 149px;
left: 99px;
}
dd#m4p3s1 a:hover
{
position: absolute;
background:  url(/images/RiskMatrix_4x4.png) -98px -550px no-repeat;
top: 150px;
left: 99px;
}

我用 IE Dev 检查了样式。工具栏（我想要 IE 的 firebug），并且所有样式都已到位，图像在服务器上，但它不会在 IE 中显示！！！

我很确定这是一些愚蠢的 IE CSS 怪癖，请帮忙。

更新： @RoBorg：您的建议没有解决问题，但解决了“悬停”问题。问题出在绝对定位的外部 div 和一些菜单样式上，它们以某种方式搞砸了整个事情。

【问题讨论】：

标签： css internet-explorer css-sprites

【解决方案1】：

IE 不会将:hover 应用于没有href 的<a>。这应该有效：

<a href="#" onclick="setDropDownListValues(3,1,2,4); return false;"
     onmouseover="setDropDownListValues(3,1,-1,4);">

【讨论】：