多栏布局与盒布局

使用float和position属性的缺点：两个div是独立的，一旦某一个div添加一些内容，就会出现空白区域，两个元素的底部不能对齐

使用column-count进行多栏布局

div
{
-moz-column-count:3; /* Firefox */
-webkit-column-count:3; /* Safari 和 Chrome */
column-count:3;
}

与position float的区别是：使用后两个属性时只需单独设定每个元素的宽度即可，而使用多栏布局时需要设定元素在多个栏目相加后的总宽度。

盒布局

flex弹性盒模型