IE 中的下拉菜单隐藏在其他元素后面

我已经在我的一个项目上安装了 site5 上的 Boldy 主题，但遇到了一个主要问题。

在 Internet Explorer（8 或更低版本）中浏览时，顶部下拉菜单会显示在其他一些元素（主要内容滑块、H1 等）后面。我已经尝试了一切，从将所有 z 索引更改为固定位置，但没有运气。

您可以通过访问site5的Boldy演示页面查看问题http://wordpress.site5.net/boldy/ http://wordpress.site5.net/boldy/并将鼠标悬停在 IE 中顶部菜单的博客选项卡上。

我已经要求site5调查一下，他们已经意识到了这个问题，但未能找到任何解决方案。

好的原始解决方案在这里 -瑞士信贷网站 http://www.chkredit.ch/。这可行，但使用了复杂的 z-index 解决方案。 这是非常简单且改进的解决方案 -Jeyjoo 库存图片库 http://www.jeyjoo.com/gallery/这适用于 IE6+、firefox、opera、safari 和 chrome

Solution

The HTML

<div id="container_page" class="container_page">
  <div id="container_header" class="container_header">
    NAV BAR GOES HERE
  </div>
  <div id="container_body" class="container_body">
    ...body text...
  </div>
</div>

The CSS

#container_page #container_header {position:relative;z-index:2;}
#container_page #container_body {position:relative;}

为什么它有效

你必须告诉 IE 这两个 div 是如何相互关联的。