html - IE 悬停时闪烁

Question

首先请注意，是的，我在论坛上搜索了这个，但它们都与 jQuery 闪烁有关...

FF 和 Chrome 工作正常...我在“.social”链接上悬停时出现闪烁...并且无法删除悬停时的背景...

这只是一个 IE 错误吗？

我想声明类“社交”，它们不会像其他链接那样继承背景渐变...？？？

HTML:

<div id="headerWrap">
    <ul>
      <li><a href="#">HOME</a></li>
      <li><a href="#">ACADEMY INFO</a></li>
      <li><a href="#">TRANING VIDEOS</a></li>
      <li><a href="#">ABOUT ALLIANCE</a></li>
      <li><a href="#">BJJ BLOG</a></li>          
      <li><a class="contact" href="#">CONTACT US</a></li>
      <li class="last">
          <a class="social" href="#"><img src="facebook.png"></a>
          <a class="social" href="#"><img src="youtube.png"></a>
          <a class="social" href="#"><img src="twitter-2.png"></a>
      </li>
   </ul>
</div>

CSS:

#headerWrap {
    background: url("../images/separator.png") no-repeat scroll right top transparent;
    margin: 0 auto;
    width: 960px;
}
#headerWrap ul {
    background: url("../images/separator.png") no-repeat scroll 0 0 transparent;
    color: #FFFFFF;
    height: 50px;
    list-style-type: none;
    margin: 0;
    padding: 0;
}
#headerWrap ul li {
    background: url("../images/separator.png") no-repeat scroll right top transparent;
    float: left;
    height: 50px;
}
#headerWrap ul li.last {
    background: none repeat scroll 0 0 transparent;
}
#headerWrap ul li a {
    color: #FFFFFF;
    display: block;
    font-weight: bold;
    height: 35px;
    padding: 15px 20px 0;
    text-decoration: none;
}
#headerWrap ul li a:hover {
    background: -moz-linear-gradient(center top , #CACA5A, #909501) repeat scroll 0 0 transparent;
    color: #FFFFFF;
    cursor: pointer;
    font-family: Arial,sans-serif;
    font-weight: bold;
    height: 35px;
    outline: medium none;
    text-decoration: none;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
}
#headerWrap ul li a.social {
    background: none repeat scroll 0 0 transparent;
    float: left;
    padding: 15px 10px 0;
    width: 50px;
}

Answer 1

试试这个:

#headerWrap ul li a.social,
#headerWrap ul li a.social:hover {
    background: none repeat scroll 0 0 transparent;
    float: left;
    padding: 15px 10px 0;
    width: 50px;
}