css - 位置 : relative appearing over position:absolute

Question

在 IE7 中有一个奇怪的问题。在许多地方，我有一个 DIV，其上有 position: absolute(人造下拉菜单)，只要它后面有 position: relative 的东西，相对定位的元素将通过另一个 div 显示。

相对定位的元素没有设置任何 z-index，而绝对定位的元素(我想要在顶部的元素)的 z-index 为 1000。

http://skitch.com/louiswalch/dub5h/microsoft-windows-vista

Answer 1

我怀疑您已经尝试过了，但是在您的相对定位元素上设置了一个 z-index 作为第一个低于绝对定位元素的 z-index测试。

如果这不起作用，您需要确保两个元素都在同一个 stacking context 中.在 IE 中，无论何时将 position CSS 规则应用于元素，它都会在该元素内生成一个新的堆叠上下文。这意味着 z-index 只会在该元素的子元素中得到适当的尊重，而在其他堆叠上下文中 较低的 z-index 可能仍会堆叠在上面。

在您的情况下，您需要将下拉列表和按钮放在相同的堆叠上下文中或将 z-index 应用于生成其单独堆叠上下文的 2 个元素。