1

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

现在的问题是我的 body 也占据了 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 。即使整个 body 显示为蓝色，如果您启动开发人员工具并检查，您会看到 html 和 body 都占据

体高更小

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

4

1 回答 1

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 将标签附加到您的容器中。这是执行此操作的示例链接！

如果它没有帮助尝试height:autoand 还overflow:visible为您的容器！

于 2013-01-26T19:45:52.860 回答