IE8的z-index

Question

这是非常令人沮丧....

http://jsfiddle.net/RRnm8/

作品以及在每一个浏览器，除了IE8 ...

应该显示像这样：

correct version http://f.cl.ly/items/4410273m1G1m1O2U0K0a/Screen%20shot%202011-04-04%20at%2016.40.54.png

但在IE8你得到这样的：'（

wrong version http://f.cl.ly/items/2e351L0G3y2H1O1g1a1L/Screen%20shot%202011-04-04%20at%2016.41.41.png

所以问题是如何让这个在IE8中正常工作？

请提供答案作为一个真正的工作示例在jsfiddle ...

This buddy具有完全相同的问题。他没有得到答案，但this这显然是不行的，所以我对工作的例子展示它各种要求的提前:) jsfiddle

感谢

Answer 1

这个问题似乎与IE如何处理与z索引栈。在FF和Chrome对象中使用z-index文档范围内的元素，在IE中，正如您可能知道的那样，z-index首先基于父级的z-索引。

我认为：之前的内容使这个问题复杂化，尽管它有一个负z-索引，它是在父元素之内。与其索引进行比较的元素不是父级div，因为它将在FF或Chrome中，但div中的内容即p元素。 p元素不是块，它也共享父div的z-index，因此它不能低于：before内容。

解决的办法是制作一个内部div，或者给出p元素的相对定位和样式。

参见：http://jsfiddle.net/RRnm8/3/