html - 内部左浮动 div 不会垂直扩展容器 div

Question

我有一个具有以下属性的容器 div:

#cat_container{
margin:0;
padding:5px;
border:1px solid red;
min-height:200px;
}

里面有多个左浮动的div。问题是它们不会强制包含的 div 向下扩展，而只是重叠并继续超出容器 div 的边界。

左浮动div:

.cat_wrap{
border: 1px solid #000;
width:100px;
min-height:120px;
margin:0 10px 5px 0;
padding:0;
float:left;
}

如果我取出左边的 float ，包含的 div 确实会像它应该做的那样垂直扩展。那么如何让内部 div 向左浮动，同时垂直扩展容器 div？

Answer 1

你需要为主div设置overflow。溢出:自动；这将强制 div 容器扩展并适应内容。

#cat_container{
   margin:0;
   padding:5px;
   border:1px solid red;
   min-height:200px;
   overflow: auto;
   height: auto !important;
}