css - 负：在绝对定位元素上的 z-index 之前在 IE8 中不起作用

Question

我已经搜索过这个问题，并且知道 IE8 具有带有伪标签的渲染元素的怪癖，但找不到我的问题的解决方案。我试图绝对定位一个元素并向其添加一个伪 :before 元素，该元素必须位于其父元素之下。

使用：

.container:before {
    z-index: -1;
}

用 Firefox 和 Chrome 做这个把戏，但在 IE 上不行；这是小提琴http://jsfiddle.net/WaTnn/

如何在 IE8 中将黄色元素定位在红色下方，并且仍然让它的父元素被绝对定位？

Answer 1

我找到了一个可行的解决方案：

1. 在容器内添加一个相对定位的 div
2. 设置它z-index: -1
3. 将:before元素添加到 div 而不是容器中。

这是一个小提琴http://jsfiddle.net/WaTnn/3/

如果有人有更好的解决方案，我很高兴看到它。

Answer 2

正如这里所说：链接

IE8 Partial Support
z-index not respected, must use a doctype, must declare a :hover state if you use :hover:after/:hover:before