CSS спрайты не работают в IE [8/7/6] - PullRequest
Новая
       9

CSS спрайты не работают в IE [8/7/6]

2 голосов
/ 18 февраля 2009

Я пытаюсь с помощью CSS использовать спрайты для анимации моей матрицы риска ... она отлично работает в 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. Панель инструментов (я хочу Firebug для IE), и все стили на месте, изображение на сервере, но он не будет отображаться в IE !!!

Я предчувствую, что это какая-то глупость в CSS IE, пожалуйста, помогите.

ОБНОВЛЕНИЕ: @RoBorg: ваше предложение не решило проблему, но оно решило проблему "зависания". Проблема оказалась в абсолютно позиционированном внешнем элементе div и некоторых стилях меню, которые каким-то образом все испортили.

1 Ответ

12 голосов
/ 18 февраля 2009

IE не применяется :hover к <a> без href. Это должно работать: 

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