尝试不使用 jQuery 脚本来实现砖石效果,因此寻找 CSS 替代方案。
我正在尝试使用列计数,这似乎有效,但不符合预期。
因此,列就在那里,但有时容器中的项目会被拆分为多个列,正如您应该在此示例中看到的那样:
http://jsfiddle.net/DTcHh/3858/ http://jsfiddle.net/DTcHh/3858/
#builds {
width: 100%;
}
.cols {
-moz-column-count:4;
-moz-column-gap: 3%;
-moz-column-width: 25%;
-webkit-column-count:4;
-webkit-column-gap: 3%;
-webkit-column-width: 25%;
column-count: 4;
column-gap: 3%;
column-width: 25%;
}
.item {
height: auto;
width: 100%;
}
我对数据库中的项目使用分页,有时一切正常,但有时则不然。
关于为什么/我做错了什么有任何逻辑吗?
I think this http://www.w3.org/TR/css3-multicol/#break-inside是你需要的
.items {
-webkit-column-break-inside: avoid;
-o-column-break-inside: avoid;
-moz-column-break-inside: avoid;
break-inside: avoid;
}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)