将主体的高度设置为大于绝对div的高度

Question

我的页面设计中有一个绝对div作为主要内容区域。我有另一个占据顶部的div，高度为450px。在页面加载之前我无法知道绝对div的高度，所以只有在页面加载发生后才能找到它。

现在的问题是我的身体也占据了450px（身高），所以如果我想在绝对div结束后显示某些内容我无法这样做。

摘要：

Absolute Div : 600px (for example, don't know the actual height) Has position:absolute.
Top Div : 450px (No position:absolute)
Body Becomes 450 px as expected

如何将div放在绝对div下方。目前我唯一能想到的是jQuery。

这是我做的jsfiddle来说明问题。即使整个身体显示蓝色，如果你启动开发工具并检查，你会看到html和身体都占用

更新：Linky我正在尝试在几个元素上方显示主要内容区域。你看到的那些圈子是独立的元素。他们需要保持这种状态。

Answer 1

我认为您需要了解有关职位的更多信息！ 无论如何，如果你将位置改为亲戚，你所指的当前问题将会解决！

<div id="First Div" style="height:100px;width:50px;position:relative;background-color:green;">
</div>
<div id="BelowDiv" style="height:100px;width:50px;position:relative;background-color:pink;">
</div>

但是如果你真的需要将它放置在静态或其他单词“绝对”的地方，那么你需要放置一个容器div并将其设置为绝对位置，然后将另外两个或更多位置放在容器Div中。

<div id="container" style="position:absolute; top:y; left:x">
     <div id="FirstDiv" style="position:relative;></div>
     <div id="SecondDiv" style="position:relative;></div>
</div>

您可以使用jquery将标记附加到容器中。 here is the sample link to do it!

如果没有帮助您尝试容器的height:auto和overflow:visible！