位置：相对出现在位置：绝对 [英] position: relative appearing over position:absolute

问题描述

在IE7中有一个奇怪的问题。在很多地方，我有一个DIV它的位置：绝对的（faux下拉）每当有一些事情后面它有位置：相对的相对定位项目将显示通过其他div。

Having a strange issue in IE7. In a number of spots, I have a DIV which has position: absolute on it (faux dropdown) whenever there is something behind it which has position: relative the relative positioned item will show through the other div.

相对定位的项目没有任何z-index集合，而绝对定位的项目（我想要的顶级项目）的z-index为1000.

Relativly positioned item does not have any z-index set, while the absolutely positioned item (the one I want on top) has a z-index of 1000.

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

推荐答案

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

I suspect you've already tried it, but set a z-index on your relatively positioned element that's lower than your absolutely positioned element's z-index as the first test.

如果这不起作用，您需要确保两个元素都在同一个堆叠上下文。在IE中，每当将 position CSS规则应用到元素时，它会在该元素中生成一个新的堆栈上下文。这意味着z-index将仅在该元素的子元素内正确地被尊重，并且在其他堆积上下文中的子元素与较低的z-索引仍然可以堆栈在上面。

If that doesn't work, you need to make sure both elements are in the same stacking context. In IE, whenever you apply the position CSS rule to an element, it generates a new stacking context within that element. That means that z-index will only be properly respected within that element's children and children in other stacking contexts with lower z-indexes may still stack above.

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

In your case, you either need to put the dropdown and button in the same stacking context or apply z-index to the 2 elements that are generating their separate stacking contexts.

这篇关于位置：相对出现在位置：绝对的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！