Я пытаюсь использовать спрайты CSS для анимации моей матрицы рисков ... она отлично работает в Firefox и Chrome, но изображение не будет отображаться в IE ...CSS Sprites не работают в IE [8/7/6]
код ниже, не хочу, чтобы вставить все это здесь, но отрывок показывает картину:
<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;
}
I проверил стили с помощью IE Dev. панель инструментов (я хочу firebug для IE), и все стили на месте, изображение на сервере, но это НЕ ПОКАЗАТЬ В IE!
Я до сих пор уверен, что это какая-то глупость IE CSS quirk, пожалуйста, помогите.
ОБНОВЛЕНИЕ: @RoBorg: ваше предложение не решило проблему, но решило проблему «зависания». Проблема оказалась внутри с абсолютно позиционированным внешним div и некоторыми стилями меню, которые каким-то образом ввернули все это.