具有不同z-index的父级中的浮动div会相互影响

Question

布局非常简单。

<div id="div1">
    <div id="div1-child">
    </div>
</div>
<div id="div2">
    <div id="div2-child">
    </div>
</div>

两个孩子都漂浮在父母的100％高度。但是第一个孩子有点低，所以第二个div向左推，以获得第一个的免费空间。我需要div2-child重叠div1-child。但是，如果我将z-index设置为div1和div2，div1-child只会被仍然影响div2的{​​{1}}重叠。

我需要对此进行解释。

这是fiddle。

Answer 1

如果您提供相对于父母的位置，则必须以绝对位置进行第二次儿童潜水。

如果你同意第二个div孩子的绝对位置比你的工作演示低于

jsfiddle.net/2Js5B/2 /