Question

我在IE 6中的导航时遇到了一个奇怪的问题。只有导航的第一个和最后一个链接在悬停时反弹。

为什么会这样？

我的CSS文件：

#navigation {
    width: 930px;
    height: 30px;
    background-color: #f1faff;
    text-align:center;
}

#navigation  ul {
    margin: 0px;
    padding: 0px;
    list-style: none;
    line-height: 30px;
}

#navigation  ul li {
    display: inline;
}

#navigation  ul li a {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    font-weight: bold;
    color: #0067b4;
    display: inline;
    text-decoration: none;
    text-transform: uppercase;
    padding: 7px 50px;
}

#navigation  ul li a:hover {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    font-weight: bold;
    color: #5e5e5e;
    display: inline;
    text-decoration: none;
    text-transform: uppercase;
    padding: 7px 50px;
}

#navigation  ul li a.first {
    padding-left: 8px;
    margin: 0px;
    overflow: hidden;
    border: 0px;
}

#navigation  ul li a.last {
    padding-right: 8px;
    margin: 0px;
    overflow: hidden;
    border: 0px;
}

发生这种情况的网站位于http://www.paysonsecure.com/protekskiracing/

Answer 1

我会将此添加到您的global-ie6.css

#navigation ul { display: inline-block; }

Answer 2

谢谢gutierrezalex !!我有同样的问题，它可以在我的样式中添加{display：inline-block;} ..适用于任何浏览器：

ul.menu li a{
    text-decoration:none;
    color:black;
    display:block;
    padding:0;
    margin:0;
    display:inline-block;
   }

ul.menu li a:hover{
   background-color:#5cc2ed;
   color:#ffffff;
   display:inline-block;
  }

导航仅在IE 6中的第一个和最后一个li链接上弹跳

2 个答案: