下拉菜单隐藏在IE中的其他元素后面 [英] Dropdown menu hides behind other elements in IE

问题描述

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

I have installed the Boldy theme from site5 on one of my projects and have run into one major problem.

浏览Internet Explorer下面），顶部的下拉菜单显示在一些其他元素（主要内容滑块，H1的等）后面。我已经尝试了从改变所有z索引到固定位置，没有运气。

When browsing in internet explorer (8 or lower), the top dropdown menu gets displayed behind some other elements (main content slider, H1's etc.). I've tried everything from changing all the z-index's to fixed positions, with no luck.

您可以访问site5的Boldy演示页面 http：/ /wordpress.site5.net/boldy/ ，并将鼠标悬停在IE的顶部菜单的博客标签中。

You can view the problem by visiting site5's Boldy demo page http://wordpress.site5.net/boldy/ and hovering over the top menu's blog tab in IE.

我要求site5调查，

I have asked site5 to look into it, they are aware of the problem, but have failed to find any solutions.

推荐答案

Ok originale解决方案在这里 - 瑞士信用网站。这工作，但使用复杂的z-index解决方案。
这里是非常简单和改进的解决方案 - Jeyjoo库存图库
适用于IE6 +，firefox，opera，safari和chrome

Ok originale solution here - Swiss credit website. This works but uses a complicated z-index solution. Here is very simple and improved solution here - Jeyjoo stock image gallery This works in IE6+, firefox, opera, safari and chrome

解决方案

strong> HTML

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>

CSS

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

为什么它工作

IE如何两个div相互关联。

You have to tell IE how the two divs relate to one another.

这篇关于下拉菜单隐藏在IE中的其他元素后面的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！