1. 使用text-align:justify

.content{
text-align:justify;
text-align-last:justify;
line-height:0;
height:44px;
}

@media all and (-webkit-min-device-pixel-ratio:0){
.content{
font-size:0;
}
}

.content:after{
display:inline-block;
overflow:hidden;
width:100%;
height:0;
content:'';
vertical-align:top;
}

-------------------------------------------------------------------------------

父类容器css:
.content{
display:-webkit-box;
display:-webkit-flex;
display:-ms-flexbox;
display:flex;
-webkit-box-pack:justify;
-webkit-justify-content:space-between;
-ms-flex-pack:justify;
justify-content:space-between;
}

-------------------------------------------------------------------------------

/*
说明：
1.column-count定义了对象的列数
2.column-gap定义了对象中列与列的间距

父类容器css:
.content {
-webkit-column-count: 2;
-moz-column-count: 4;
column-count: 4;
-webkit-column-gap: 20px;
-moz-column-gap: 20px;
column-gap: 20px;
}
且子类必须是block元素

做一个有博客的web前端自媒体人，专注web前端开发，关注用户体验，加我qq/微信交流：6135833

http://dingxiangming.com