IE ссылка фоновое изображение не работает - PullRequest
Новая
       2

IE ссылка фоновое изображение не работает

1 голос
/ 09 июля 2010

Привет. Я пытаюсь добавить фоновое изображение к моей ссылке. Изображение содержит два состояния, А и А: парить.

a->background-position:bottom и a:hover=>background-position:top. Он отлично работает в chrome и firefox, но IE плохо сосет и отображает общую высоту изображений (два состояния вместе). Мне было интересно, если кто-нибудь знает, как это исправить. Спасибо ..

Html 

<ul id="menu">

 <li id="dummy"><a href="#"></a></li> 
 <li id="skill"><a href="#"></a></li>

</ul>

мой css 

#menu #skill a
{
background-image:url("BTskill.png") ;
background-repeat:no-repeat;
background-position:bottom; 
list-style-type:none ;
display:block;
width:98px;
height:18px;
margin-top:5px;
}



#menu #skill a:hover
{
background-image:url("BTskill.png") ;
background-repeat:no-repeat;
list-style-type:none ;
display:block;
width:98px;
height:18px;
background-position: top;  // the image position would change if user hovers the button
margin-top:5px;

}

Обновление: Я только что узнал, если я возьму из моего в CSS 

   #menu #skill
    {
    background-image:url("BTskill.png") ;
    background-repeat:no-repeat;
    background-position:bottom; 
    list-style-type:none ;
    display:block;
    width:98px;
    height:18px;
    margin-top:5px;
    }

Это изображение будет показывать правильную высоту, но это больше не ссылка .. :( .. человек .. Я ненавижу IE, так чертовски сильно ...

1 Ответ

2 голосов
/ 09 июля 2010

вам не нужны все дублированные css для начала.

попробовать: 

#menu #skill a
{
background-image: url(BTskill.png);
background-repeat: no-repeat;
background-position: left bottom;
display: block;
width: 98px;
height: 18px;
margin-top: 5px;
}

#menu #skill a:hover
{
    background-position: left top;
}

убедитесь, что селектор наведения находится после состояния отсутствия наведения в вашем CSS, вы всегда можете попробовать добавить !important в конец.

также попробуйте дать a некоторый контент, например &nbsp;

...