Question

我有两个div。

第一个覆盖整个屏幕并具有透明背景

另一个div具有白色背景和更高的z-index，然后是第一个div。但透明背景覆盖了第二个div与白色backgorund ...我该怎么做才能解决这个问题？

.lightbox{
        top: 0;
        left: 0;
        background: #000;
        width: 100%;
        height: 100%;
        position: absolute;
        z-index: 1000;
        filter:alpha(opacity=50);
        opacity:0.5;
}

#lightboxContent{
        display: none;
        width: 325px;
        height: 260px;
        background: #FFF;
        position: absolute;
        z-index: 2000;
        top:0;
        border:3px solid #CCC;
        text-align:center;
}

Answer 1

http://jsfiddle.net/DHYFz/

使用IE7+进行设置时，这对我来说非常合适。您代码的其他部分可能存在重叠元素？

可能的问题：如果你这样做，让我们说，嵌套lightboxContent元素，请记住，父z-index将胜过孩子。

简单的解决方法是，不要嵌套灯箱＆gt; lightboxContent。无论如何都要占用容器的全宽和高度。

Answer 2

一种简单的方法是通过放置在HTML的顶部来停止IE7。

z-index问题IE 7

2 个答案: