IE7 CSS Fly-out 菜单怪异

Question

我被要求为一个预先存在的网站设计一个弹出式菜单，它在除 IE7 之外的所有浏览器上看起来和表现都很好。出于某种原因，不同版本的 IE7 行为不同。过去两天我一直在与此作斗争，在使用 IE v7.0.5730.11 进行测试后，菜单看起来不错，位置正确，但有奇怪的消失行为。使用其他次要版本 IE7 的用户报告定位和呈现不一致的问题。

各位好心人能帮我从这个网站检测出有问题的 CSS/HTML 吗？

Answer 1

我想我会回答我自己的问题。我在菜单中遇到的主要问题是 <li> 元素在 IE7 中没有布局 (hasLayout = false)，所以在 this site 的帮助下，我不得不使用：

ul#mainmenu li ul li,
ul#mainmenu li ul li span {
    display: block;
    max-width: 100%; 
}

给这些项目布局。这在列表项之间创建了 1px 的间隙。当鼠标悬停在这个 1px 的间隙上时，菜单会消失，所以我使用以下 css 修复了这个问题：

ul#mainmenu li ul li {
    margin-bottom: -1px;
}

希望这对某人有所帮助。