FF4溢出和Z索引问题（孩子不会溢出另一个父母）

FF4中有这个看似简单的问题。
在下面的代码中，我需要P1_child溢出（放置在上面）P2_child。但是P1_child消失在P2后面（甚至没有按照预期说到P2_child）FF4溢出和Z索引问题（孩子不会溢出另一个父母）

我是否缺少一些简单的东西？

<div> 

    <div id="P1" style="position:relative; z-index: 21;"> 
    <div id="P1_child" style="z-index: 2;"></div> 
    </div> 

    <div id="P2" style="position:relative; z-index: 21;"> 
    <div id="P2_child" style="z-index: 1;"></div> 
    </div> 

</div>

在此先感谢

来源

2011-05-25 Pierre

测试它，你忘了包括代码？ – Jrod 2011-05-25 14:24:39

对不起，现在包括它。 – Pierre 2011-05-25 14:28:52

您的代码适合我：http://jsfiddle.net/X8h7k/ – 2011-05-25 14:35:25

您需要分配position:absolute儿童的div（否则z-index将无法正常工作），这样，他们相对于他们的父母将位置（因为他们有position:relative）。

您还需要从父级divs中删除z-index，因为当您将z-index分配给相对定位的元素时，子元素相对于其父级堆叠上下文而定位。您有完整的文档here。

<div> 

    <div id="P1" style="position:relative"> 
     <div id="P1_child" style="z-index: 2; position:absolute">P1</div> 
    </div> 

    <div id="P2" style="position:relative"> 
     <div id="P2_child" style="z-index: 1; position:absolute">P2</div> 
    </div> 

</div>

或检查，并在this jsFiddle

来源

2011-05-25 15:34:47

但我会尝试带有绝对位置的孩子，但是对于堆叠顺序。 P1_child的堆叠顺序为21.2，P2_child的顺序为21.1。那么P1_child应该会溢出并出现在P2_child之上？由于复杂的原因，父母的z-索引需要相同。 – Pierre 2011-05-26 06:30:43

查看[此链接]（https://developer.mozilla.org/en/Understanding_CSS_z-index/The_stacking_context）以更好地理解，或者[完整文档]（https://developer.mozilla.org/zh/Understanding_CSS_z-index ）。它没有21.2或21.1，它有21个，而在那个21内，它有2 ... P1（z-index：21）直接与P2（z-index：21）竞争，并且P1_child直接依赖于P1定位，P2_child也取决于P2。 - – 2011-05-26 08:25:04

好孩子作为绝对自动z-index做的伎俩。 IE7仍然存在一个问题，如果有人想评论一下这个问题，那么这个问题就好像是堆叠顺序错误。 – Pierre 2011-05-26 08:31:16

FF4溢出和Z索引问题（孩子不会溢出另一个父母）

回答

相关问题