overflow秒解外边距合并以及浮动导致的元素塌陷问题

外边距导致的合并问题：

1 处于一上一下位置的两个块级元素 在同时各自设置了上下边距时，二者间的外边距通常以 数值较大的一个作为两者间的外边距 而不是简单的数值相加

.box2{ width: 100px; height: 100px; background: deepskyblue; margin-top: 50px; } .box1{ width: 100px; height: 100px; background: red; margin-bottom: 100px; }



解决方案是： 给其中一个盒子再套一个div 并给这个div 设置overflow:hidden (开启BFC机制)

`container{

overflow: hidden;

}