overflow:hidden还可以清除浮动、解决塌陷

https://blog.csdn.net/qq_41638795/article/details/83304388
父级元素不设置高度时，高度由随内容增加自适应高度。当父级元素内部的子元素全部都设置浮动float之后，子元素会脱离标准流，不占位，父级元素检测不到子元素的高度，父级元素高度为0。由于父级元素没有高度，下面的元素会顶上去，造成页面的塌陷。因此，需要给父级加个overflow:hidden属性，这样父级的高度就随子级容器及子级内容的高度而自适应。

清除浮动是清除该元素内部的浮动，不影响元素的外部。

<html>
<head>
.box{background:skyblue;}
.kid1{width:100px;height:100px;float:left;background:yellow}
.kid2{width:100px;height:100px;float:left;background:orange}
.wap{width:300px;height:150px;background:blue;color:whilte}

<div >
<div >x1</div>
<div >x2</div>
</div>
<div >c3</div>