奇怪的问题：基于CSS的菜单在IE中的行为不同；兼容性“；模式

更新：

我给这件事加了一笔赏金。为了声明这一点，我需要下面代码的一个版本，它不显示我描述的症状

下面是一个简单的测试用例。在关闭兼容模式的Chrome、Firefox和IE8中，这项功能可以正常工作。但是，打开兼容性模式（切换通行费->兼容性视图）某些菜单块的显示和隐藏方式有问题

要了解问题，请执行以下操作：

将示例保存到文件中，并通过web浏览器查看（请注意，如果只是从文件加载，则无法打开“兼容性”视图-它必须从web服务器交付）

将鼠标从“这里”移动到“那里”再移动到“无处不在”，然后向下移动，以突出显示“否”，并显示第三级菜单。将鼠标移到左侧。仅显示顶部菜单

现在重复这些步骤。当您第二次点击“Everywhere”时，会显示第三级菜单块，但其中没有任何内容

是否有任何方法可以防止这种情况发生，即使是在兼容性视图中

样本：

---

测试
#navRaw，#navRaw ul{
保证金：0；
填充：0；
列表样式类型：无；
列表样式位置：外部；
位置：相对位置；
线高：26px；
}
#纳瓦瓦{
显示：块；
填充：0px 5px；
颜色：#000；
文字装饰：无；
背景颜色：银色；
线高：28px！重要；
}
#导航a：悬停{
背景色：#ccc；
颜色：#fff；
}
#李纳芙{
浮动：左；
位置：相对位置；
}
#纳瓦乌{
位置：绝对位置；
显示：无；
顶部：28px；
}
#纳瓦鲁·利乌拉{
宽度：220px；
高度：自动；
浮动：左；
}
#navRaw ul{top:auto；}
#纳夫劳利乌尔{
左：230像素；
保证金：0px 0 0px；
}
#navRaw li:悬停ul，#navRaw li:悬停ul ul，#navRaw li:悬停ul{显示：无；}
#navRaw li:悬停ul，#navRaw li:悬停ul，#navRaw li:悬停ul，#navRaw li:悬停ul{
显示：块；
边框：1px纯黑；
}

导航在IE9中对我来说就像预期的那样工作。在浏览器模式：IE7中，我可以重新创建您描述的错误。基本上你需要一个在IE7+中工作的基于CSS的多级下拉导航

你能不能检查一下其他已经存在的有效的例子，并将你的导航项应用到其中？

---

出于好奇，为什么不禁用兼容x-ua-compatible meta标签的兼容模式

我需要一个版本的代码下面，不显示症状 我描述

解决方案

修订的CSS

#navRaw li:hover > ul, #navRaw li li:hover ul, #navRaw li li li:hover ul, #navRaw li li li li:hover ul{ 
   display: block;
   border: 1px solid black;
}
#navRaw li:hover ul li ul li a {background-color:transparent}  
#navRaw li li:hover ul li a {background-color:silver !important}

---

某些条件会导致IE-7以IE-5模式渲染。不建议将此（以下）作为一般做法，但如果您想防止这种情况，可以尝试以下方法：

<meta http-equiv="X-UA-Compatible" content="IE=9; IE=8; IE=7" >

---

你最初的问题是IE如何/为什么这么差劲。。。我不会进入那个地狱，但我会告诉你，在“早期”版本中触发布局/显示错误是相对简单的。IE9正在朝着正确的方向发展

至于工作代码，我不能确切地说出您在这个特定情况下犯了什么错误，但它可能是一个或多个edge case错误和IE在某些元素上不适应的样式的组合

我从头开始重新构建菜单，因为这样我就确切地知道我在做什么/介绍每一步。。。要做到这一点，需要大量的经验和搜索/阅读那些罕见的IE bug，这很无聊

工作代码

免责声明：这并没有经过广泛测试，但应该可以正常工作，除非是在怪癖模式下，当然它也可以在真实的浏览器中工作

---

顺便说一句，您可以使用IE的开发者工具（f12）在本地PC上激活兼容模式。我还确保在开始之前，旧代码中的bug可以在JSFIDLLES环境中重现。请记住，JSFIDLE有一个规范化脚本，并不是所有实际应用的样式都在我自己的代码中，但我相信您可以处理它。

可能只有我一个人，但它在IE中根本不起作用。（所有版本）什么不起作用？菜单，或显示问题？悬停菜单不工作。我甚至无法显示子菜单。我觉得IE今天有点怪；我以前做过这些类型的菜单，它很有效。它在其他浏览器中有效吗？什么版本的IE？我希望它能在IE7+中工作，但我真的很想理解为什么它不能在兼容模式下工作。大概他真的希望它能在较旧的浏览器中工作，而不仅仅是在较新的浏览器中禁用兼容模式。我通常更希望用户升级他们的浏览器，但在IE的情况下，因为它不会安装在XP上，而且很多人仍然有，所以它实际上不是免费升级。所以现在，别无选择，只能适应较旧的浏览器。@BenB:不能这样做，因为这样网站的大部分功能就会停止正常运行。这是内联网应用程序中的问题，他们通常在推出浏览器升级时速度很慢。遗憾的是，这似乎无法解决问题。这看起来是可行的。你能解释一下你改变了什么，以及为什么它解决了这个问题吗？@chris它涉及重置、级联、特殊性和布局。对于懒惰的人，Iv添加了经过修订的css。

<meta http-equiv="X-UA-Compatible" content="IE=9; IE=8; IE=7" >