嵌套的z-index未按预期工作

Question

为什么红色元素不在蓝色元素后面？这对我来说没有多大意义。我已经尝试制作红色元素z-index: -1，但这不起作用。

http://jsfiddle.net/dmcgrew/6cY84/

Answer 1

红色元素是蓝色元素的子元素，因此它始终位于前面。如果你做了这个小改动，你的风格就会起作用：

<div class="parent"></div>
<div class="child">child</div>

现在这两个div是“在同一级别上”而红色的z-index变得有意义，在你的代码中它不是。