Question

我有一个div持有者，有一组div作为孩子。问题是内容是按高度变化的，具体取决于其子节点的内容，那么我如何设置持有者div的css属性自动调整为其子节点的高度之和？

我已尝试过几种配置的div holder css，如min-height，padding：auto等等。但没有成功。

感谢。

Answer 1

只需移除孩子div的高度。

当你声明高度时，无论内容是什么，它总是高度，所以当内容改变时，孩子的高度不会改变，所以持有者的高度不会改变。

.holder {
    width:250px;
    min-height:50px;
    border:1px solid #EDEDED;
}

.header {
    width:100%;
}
.body {
    width:100%;
}
.footer {
    width:100%;
}

Answer 2

创建一个名为clear的课程，并将其放在最后一个div孩子之后但仍在持有者中。

像这样：

.clear { width: 100%; height: 0px; clear: both; display: block; }

...然后

<div class="holder">
<div class="child"></div>
<div class="child"></div>
...
<div class="child"></div>
<div class="clear"></div>
</div>

Answer 3

问题是你已经在所有DIV上设置了高度，但内容超过了那个高度，所以它用完了。你要么必须删除高度，要么为每个DIV设置overflow:auto，但是你会得到一个滚动条。如果您想隐藏额外内容，可以使用overflow: hidden

自动高度div持有者的内容

3 个答案: