是有可能的z-index嵌套DIV更高（“上面”显示），然后在IE7根DIV？

StackOverflow https://stackoverflow.com/questions/910349

  •  05-09-2019
  •  | 
  •  

题

<强> UPDATE !!!

建议的答案是不正确的，我的错误。在#container的DIV应该已经有“浮动：左;”。请确认在Firefox和IE7的HTML。你可以看到不同！的

我不能得到一个嵌套DIV显示上述使用的z-index一个较高层次嵌套DIV ...叠加不断铺设在下部嵌套DIV即使下部嵌套DIV具有较高的z索引.. 。在IE7这甚至可能？

<强>下面显示蓝色#details以上在Firefox绿色#overlay，然而在IE7蓝色#details低于绿色#overlay

<强> UPDATE2： 高价：添加 “的z-index：99;”在#container的风格使得.item的div出现在类（在Firefox，IE被搞砸了：反正都显示不正确），而他们应该是覆盖下！如果没有#container的z索引集，它正确地显示在Firefox，但不是IE .... 

<html>
    <body>
        <style type="text/css">
            .item {
                float:left;width:75px;height:75px;background-color:red;
            }
        </style>
        <div id="main" style="position:relative;">
            <!-- this one should overlay everything, except #details -->
            <div id="overlay" style="position:absolute;
                                     top:0px;
                                     left:0px;
                                     width:500px;
                                     height:500px;
                                     z-index:1;
                                     background-color:green;"></div>
            <div id="container" style="position:relative;float:left;">
                <!-- these ones should display UNDER the overlay: so NOT visible -->
                <div class="item"></div>
                <div class="item"></div>
                <div class="item"></div>
                <div class="item"></div>
                <div class="item"></div>
                <!-- this one should display above the overlay -->
                <div id="details" style="position:absolute;
                                         width:200px;
                                         height:200px;
                                         background-color:blue;
                                         left:400px;
                                         z-index:99;"></div>
            </div>
        </div>
    </body>
</html>
有帮助吗？

解决方案

我相信你将不得不增加的#container的z指数在IE7这项工作。

替代文字http://img529.imageshack.us/img529/6416/24042958.jpg

其他提示

我不认为IE7将会让你这样做，除非你可以改变你的标记。

的#container没有坐在后面#overlay，直到它被赋予绝对的位置，如果你改变的#container的z指数-1，则其子#details用它去后面。

更改.items z轴折射率为-1也不会工作。

如果其不能够移动的#container以外#details ??没有看到你的努力正是实现作为一个最终的结果，你有什么样的控制，如果有的话我不能提出一个替代？

E.g。什么在覆盖点？会是一个稍微透明的股利或固体？难道你不想要隐藏的.items如果用户将无法看到他们的背后覆盖？

你可以访问任何JavaScript库如jQuery ..能够#details移动到不同的位置，在DOM？

许可以下： CC-BY-SA 和 归因
不隶属于 StackOverflow
scroll top