CSS:Div不使用子Div扩展

我有一个div，它包含3列（每列作为一个div）。问题是父div的高度没有随着列的高度而扩展

以下是讨论中的样式：

#content{
background: #fff;
clear: both;
color: #333;
padding: 10px 20px 40px 20px;
overflow: auto;
}

#leftcol { 
position:absolute;
float:left;
top:285px;
z-index:100;
background-color:#EEEEEE;
padding:5px;
-moz-border-radius: 10px;
border-radius: 10px;
}

#rightcol {
position: absolute;
right:208px;
top:285px;
width:177px;
background-color:#EEEEEE;
padding:5px;
-moz-border-radius: 10px;
border-radius: 10px;
}

#centercol {
margin-left: 288px;
margin-right:200px;
background-color:#EEEEEE;
padding:5px;
-moz-border-radius: 10px;
border-radius: 10px;
}

我认为是左右栏的绝对位置把事情搞砸了。其他每一个不使用列样式的页面都可以正常工作。父div的高度随其内部的内容而扩展

有人能帮我吗

---

Jonesy

您的父列将不会扩展以适合子列的内容，因为其中有2个是position:absolute

---

如果所有元素都是position:relative或all-position:absolute，那么它将起作用。

绝对定位元素将从文档流中取出，因此容器div不会“看到”它们。尝试向左浮动3个div，并添加

overflow:auto到容器div。后者（不是空白的“清除”div）是

或者，使用来排列3个div。
而不是清除：两者都是，最好的新方法是使用

overflow:auto

在父母身上

在建议使用这样的div之前

<div class="clear"></div>



在父级末尾，但最好的方法是使用溢出，除非有非常相关的原因，您绝对要定位
#leftcol
和
#righcol
，您应该浮动它们，以便它们包含在文档流中，如Dave Everitt所说

这个绝对位置有什么特别的原因吗？看起来简单的布局可以通过浮动/边距轻松完成。
来自faq（）：“我不应该在这里问什么样的问题？…网页设计和HTML/CSS布局，而你的职位是“设计师”，在Doctype上提问。”这是一个很好的观点：尽管你有时可能在这里得到更准确的答案：-）嗨，谢谢你的回答！我将所有3列都改为向左浮动，并添加了边距来定位它们。在水平方向上，所有东西都在正确的位置，但在垂直方向上，中心柱正好位于左侧下方。有没有解决办法？如果三根柱子现在都在正确的位置，你是说中间的柱子比左边的稍微短一点？你能把它放在什么地方吗？嗨，这是开发网站-主页上的3个专栏别介意，是我的利润把我搞砸了。中心柱的边缘是绝对的。现在全部修复感谢家长正在使用overflow:auto，但感谢我不知道它已经取代了clear:tware！您好，谢谢您的回复，我已将所有内容向左浮动，将所有内容放置在相对位置，但现在所有内容水平放置在正确的位置，但垂直放置中心柱正好位于左侧下方：(