div和溢出

Question

我有以下div模式：

<div id="red">
   <div id="green">
       <div id="blue"></div>
       <div id="blue"></div>
   </div>
 </div>

  

*红色：集中整页，位置：绝对

     

* green：子面板位置：绝对

     

* blue：子面板位置：绝对！

为什么蓝色面板溢出绿色面板？我不想在蓝色面板中使用高度？

Answer 1

带有position: absolute的元素将从布局流中取出，因此它们不会影响其他元素的位置。因此，如果你有一个内部有div的容器，而内部div有position: absolute，它的高度将不会通知父级，并且容器将作为空，除非你明确地给它高度。 / p>

附注：ID必须是唯一的，您不能拥有与blue相同ID的两个元素。改为使用类。

Answer 2

你可以设置高度和溢出：隐藏在绿色，这应该隐藏任何孩子，包括蓝色。但是，blue具有position:absolute属性允许它们溢出其父级。如果你想隐藏在其中，需要更改为position:relative或绝对以外的其他位置。