IE7下拉菜单出现在图像后面。

I have created this css3 dropdown menu that appears behind the image when I mouse over the dropdown menu, and I have tried to figure it out. But cant for the life of me. Any help is greatly appeciated you can take a look at it here.

我已经创建了这个css3下拉菜单，当我鼠标在下拉菜单时出现在图像后面，我已经尝试去弄清楚它。但我的生命却不能。任何帮助都是非常重要的，你可以在这里看一看。

3 个解决方案

#1

Quoting from this thread

引用这个线程

Z-index is not an absolute measurement. It is possible for an element with z-index: 1000 to be behind an element with z-index: 1 - as long as the respective elements belong to different stacking contexts.

z指数并不是一个绝对的度量。元素的z-index: 1000是可能的:1 -只要各个元素属于不同的堆叠环境。

When you specify z-index, you're specifying it relative to other elements in the same stacking context, and although the CSS spec's paragraph on Z-index says a new stacking context is only created for positioned content with a z-index other than auto (meaning your entire document should be a single stacking context), you did construct a positioned span: apparently IE interprets this as a new stacking context.

当你指定z - index,指定它相对于其他元素在同一叠加背景下,尽管CSS规范对z - index说新的堆垛上下文的段落只有为定位内容创建汽车以外的z - index(意味着你的整个文档应该是一个叠加上下文),你构建一个定位跨度:显然IE解释这是一个新的堆垛上下文。

UPDATE-

更新- - -

Add the following css to you page

在页面中添加以下css。

#header
{
    position:relative;
    z-index: 2;
}
#content-wrap
{
    position:relative;
}

#2

I think either of these will explain the problem and give a solution:

我想这两种方法都能解释问题并给出解决方案:

http://brenelz.com/blog/squish-the-internet-explorer-z-index-bug/
http://brenelz.com/blog/squish-the-internet-explorer-z-index-bug/
IE7 Z-Index Layering Issues
IE7 z - index分层问题

#3

Give ".nav" and "content" a z-index. Make .nav higher.

给”。和“内容”的z指数。使.nav更高。

#1