Question

我正在将滚动菜单改装成现有网站，除了IE之外，它看起来很好。这是一个包含新菜单的隐藏页面：http://preemiestoday.com/pages/about_board.php

菜单代码如下所示：

<ul>
<li  id='link0'><a href='/index.php'>Home</a></li>
<li  id='link1'><a href='/pages/about_new.php'  onmouseover='showabout()'  onmouseout='hideabout()'>About Us
<div id="aboutRollout" style="display:none" onmouseover="showabout()"  onmouseout="hideabout()">
<ul>
<li><a href="pages/about_new.php">Mission</a></li>
<li><a href="/pages/about_board.php">Board Members</a></li>

<li><a href="/pages/about_donate.php">Donate</a></li>
<li><a href="/pages/about_partners.php">Partners</a></li>
</ul></div></a></li>
<li  id='link2'><a href='/pages/members.php'>Join Us</a></li>

等等。 about rollout的CSS如下所示：

#aboutRollout {
position:absolute;
left:inherit;
top:193px;
width:120px;
z-index:5;
background-color:#CAD5EC;
color:#000;
border:1px solid #fff;
padding-top:5px;
z-index:100;
}
#aboutRollout LI {
border:none;
padding: 0 5px 5px 5px;
font-size:11px;
white-space:nowrap;
}

#aboutRollout LI A {
background-color:#CAD5EC;
color:#000;
text-decoration:none;
}

#aboutRollout LI A:HOVER {
background-color:#CAD5EC;
color:#000;
text-decoration:underline;
}

问题在于，IE将left:inherit; #aboutRollout解释为关于链接文本的结尾而不是开头。

有任何建议让它在IE中的LI下排队吗？

Answer 1

只需将此DOCTYPE添加为第一行，即可将其从IE浏览器的“Quirks模式”中删除，排列IE7 / 8，Firefox，Chrome中的菜单：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

我没有注意到它搞砸了你网页上的任何其他内容（专业）。

IE中继承的左侧位置不同

1 个答案: