1

我有一个容器，我在其中放置了一堆元素，我的期望是容器会随着容器填充元素而向下扩展。不幸的是，这种情况并非如此。我有一些 div 漂浮在我的容器边缘。我可以用一堆中断标签来解决这个问题，但这是一个草率的解决方案。

也许我的 CSS 不正确，但我不知道在哪里。长选择列表和主要描述应位于上方的白框中。

这是一个小提琴。

编辑：Uwe 带领我研究花车。我发现在正常流程布局中不考虑浮动。那么这是如何解决的呢？

编辑 2：我找到了一个 clearfix 解决方案。

.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}
.clearfix {
    display: inline-block;
}
* html .clearfix {
    height: 1%;
} /* Hides from IE-mac \*/
    .clearfix {
        display: block;
}
4

1 回答 1

3

清除浮动的方法有很多；只需附加overflow: hidden;到即可.main解决您的问题。

但在实践中，最好直接清除导致问题的浮动，而不是对父 div 进行修复。我实际上建议将以下属性附加到 .bottom 中：

.bottom {
    clear: both;
    overflow: hidden;
}
  • clear: both负责清除.content.
  • overflow: hidden负责清除浮动.bottom

id除了classHTML 标签的属性之外，您还应该考虑使用该属性。

于 2012-06-10T09:59:01.253 回答