我正在尝试使用 css3 规则在 8 列中显示项目column-count。但是,有时显示 6,有时显示 7。我尝试为项目设置特定宽度,但似乎没有任何效果。
body {margin: 0;}
.container {
margin: auto;
padding: 0 15px;
background: #eee;
}
@media (min-width: 768px) {
.container {width: 750px;}
}
@media (min-width: 992px) {
.container {width: 970px;}
}
@media (min-width: 1200px) {
.container {width: 1170px;}
}
.brick-wall {
-webkit-column-gap: 0;
-webkit-column-fill: balance;
-moz-column-gap: 0;
-moz-column-fill: balance;
column-gap: 0;
column-fill: balance;
-webkit-column-count: 8;
-moz-column-count: 8;
column-count: 8;
}
.brick {
-webkit-column-break-inside: avoid;
-moz-column-break-inside: avoid;
column-break-inside: avoid;
text-align: center;
}
.brick-wall …Run Code Online (Sandbox Code Playgroud)