CSS系统替代砌体

Question

我记得一个替代Masonry(Vanilla)的CSS网格系统http://masonry.desandro.com/.该网站是黑色背景并显示/排列彩色框(周期表元素).它还有基于其形状和大小的过滤盒(如圆形,方形等).它还使用硬件加速.我花了很多时间找到它,但没有运气.谁知道这个网站？

Answer 1

我正在使用它.它适用于Bootstrap.基本上不是容器,我使用的是WALL:

<style>
.wall {
    width: 100%;
    padding: 0 20px;
    -moz-column-gap: 20px;
    -webkit-column-gap: 20px;
    column-gap: 20px;
    -moz-column-count: 1;
    -webkit-column-count: 1;
    column-count: 1;
} 
.wall > .brick {
    display: inline-block;
    width: 100%;
}

@media screen and (min-width:860px) {
    .wall {-moz-column-count: 2; -webkit-column-count: 2; column-count: 2;}
}

@media screen and (min-width:1280px) {
    .wall {-moz-column-count: 3; -webkit-column-count: 3; column-count: 3;}
}

@media screen and (min-width:1700px) {
    .wall {-moz-column-count: 4; -webkit-column-count: 4; column-count: 4;}
}

</style>    

这是设计砖,必须至少400px.min-width如果你不喜欢400,你可以做数学并改变s.