CSS行布局

*{
margin: 0;
padding: 0;
}
.row {
display:block;
box-sizing:border-box;
}
.row:before {
content: ‘’;
display: block;
clear: both;
}
.row:after {
content: ‘’;
display: block;
clear: both;
}

以行为单位，div附加该样式，能够根据内容计算高度，在伪类中清除了行之间的浮动关联，不会出现塌陷问题

注：BFC问题
垂直或者水平方向控制间距时，请尽量使用统一的间距设置
例如 希望两个方块间距为30px 假设你给第一个设置10px的下边距，第二个设置20px的上边距，结果得到的会是20px的边距，原因在于BFC（块级元素格式化上下文）原理，相邻的元素垂直或者水平方向的边距会被计算为重合，取最高值。
解决的方法 1.只设置第一个方块的下边距或者只设置第二个方块的上边距
2.使用定位解决