我有一组具有这种布局的 div:
div.post_summary {
clear: none;
width: 170px;
display: inline-block;
float: left;
margin: 5px;
background-color: #FF5900;
}
现在看起来像:
但我希望它看起来像:
div 的顺序并不重要。我怎样才能做到这一点?
我有一组具有这种布局的 div:
div.post_summary {
clear: none;
width: 170px;
display: inline-block;
float: left;
margin: 5px;
background-color: #FF5900;
}
现在看起来像:
但我希望它看起来像:
div 的顺序并不重要。我怎样才能做到这一点?
由于顺序无关紧要,您可以使用 CSS 列执行此操作:
http://codepen.io/cimmanon/pen/CcGlE
div.container { /* container holding all of your `div.post_summary` elements */
columns: 20em; /* desired width of the columns */
}
div.post_summary {
margin: .5em;
background-color: #CCC;
}
div.post_summary:first-child {
margin-top: 0;
}
确保您检查http://caniuse.com/#feat=multicolumn以查看您需要哪些前缀。