我在IE7的下拉菜单中遇到了一些问题。 它在所有其他浏览器中工作正常,但出于某种原因在IE7中出现偏移。有任何想法吗? 请参阅下面的菜单代码和Firebug中的计算CSS以及演示问题的图像。
正确的菜单
偏移菜单
HTML
<ul id="coolMenu">
<li class="">
<a class="donate" href="#">
User Options
<span class="downarrowclass"></span>
</a>
<ul id="style_me" style="display: none;">
<li>
<a href="#">Candidate Panel</a>
</li>
<li>
<a href="#">Access details</a>
</li>
<li>
<a href="#">Personal details</a>
</li>
<li>
<a href="#">History</a>
</li>
<li>
<a href="#">Withdraw application</a>
</li>
<li>
<a href="#">Jobs by e-mail</a>
</li>
<li>
<a href="#">Log off</a>
</li>
</ul>
</li>
</ul>
CSS
#coolMenu,
#coolMenu ul {
list-style: none;
}
#coolMenu {
float: right;
}
#coolMenu > li {
/*float: left;*/
}
#coolMenu li a {
display: block;
text-decoration: none;
color: #ffffff;
width: 100px;
text-align: center;
}
#coolMenu ul {
position: absolute;
display: none;
z-index: 999;
}
#coolMenu li:hover ul {
display: block;
}
.dropdown a li{
color: #124162 !important;
}
#coolMenu li #style_me li a{
color: #124162 !important;
width: 140px !important;
}
#coolMenu li #style_me li a:hover {
color: #ffffff !important;
}
如果有帮助,IE开发人员标签中似乎存在某种形式的偏移:
此外,这里是ul coolmenu的iedeveloper中的计算代码。
答案 0 :(得分:1)
这可以通过使用以下代码专门针对IE7来修复:
Html.ie7 #coolMenu ul {
top: 59px;
left: 71px;
}