两列流式布局CSS

.a{
/* width: 200px;;*/
height:auto;
background: #2A4175;
border-radius: 4px;
/*margin-top: 10px;*/
/* float: left;*/
/* margin-left: 2%;*/
box-sizing: border-box;
overflow: hidden;
position: relative;

/*

关键CSS*/
-moz-page-break-inside: avoid;
-webkit-column-break-inside: avoid;
break-inside: avoid; /*break-inside: avoid; 避免元素内部断行并产生新列*/
margin-bottom: 10px;

}
#content{
width: 90%;
margin: 0 auto;
margin-top: 74px;

/*

关键CSS*/


-moz-column-count: 2; /* Firefox */
-webkit-column-count: 2; /* Safari �� Chrome */
column-count: 2; /* 将 div 元素中的文本分为2列,并规定列间1rem像素的间隔。 */
-moz-column-gap: 2%;
-webkit-column-gap: 2%;
column-gap: 2%;

}

posted on 2019-08-09 10:07  Just丶随心  阅读(603)  评论(0编辑  收藏  举报

导航