html - 当父级使用自动高度时，如何在父级 div 内重叠 div？

Question

我有两个 div，我想将它们放在另一个之上，这样我就可以在我制作的 applet 中创建一个选项卡系统。这两个 div 驻留在一个父 div 中，它使用自动高度，因为我不知道其他两个 div 的确切高度(两个 child 的高度相同)。当父级使用相对定位时，我可以使用绝对定位将两个 div 一个放在另一个之上，但是自动高度没有响应(很可能是因为绝对定位的子级)创建一个空 div 的边界线而不是一个内部包含元素的包装器。

请在此处查看问题:http://jsfiddle.net/h5bjt69s/

<div id = "parent">
    <div id = "redDiv"></div>
    <div class = "clearfix"></div>
    <div id = "blueDiv"></div>
</div>

我尝试从中建模一个解决方案，但我相信自动高度会把事情搞砸。 Position absolute but relative to parent

如何将两个 div 包裹在父 div 中并仍然保持两个子 div 的叠加？

Answer 1

这个:

both children will be of same height

实际解决了你的问题:

• 使用 position: static 定位一个 div；它将确定 parent 的高度
• 使用 position: absolute 定位其他 div(它将出现在顶部)

Updated Fiddle