CSS系統替代砌體

我記得一個CSS網格系統替代砌體（香草）http://masonry.desandro.com/。該網站是黑色背景，並顯示/安排彩色框（元素週期表元素）。它也有基於它們的形狀和大小的過濾框（如圓形，方形e.t.c）。它也使用硬件加速。我花了很多時間找到它，但沒有運氣。有人知道這個網站？CSS系統替代砌體

來源

2012-12-08 Ergec

請使用適當的搜索引擎和專爲搜索網站設計的工具。 – PenguinCoder

在這裏，我不是要求你們找到我一個隨機的網站/代碼。我問的是CSS系統的名稱，它是砌體的直接替代品，它已經存在，我只是把它命名爲它的名字。我甚至不問「如果有這樣的系統」。所以我相信我的問題是合法的。 – Ergec

我從這個問題中獲得了價值，因爲我在尋找同位素。儘管如此，問題可能會更好。 –

爲什麼不檢查其對應的來源，同位素： http://isotope.metafizzy.co/index.html

來源

2012-12-08 17:07:02 BenM

甚至不知道它是同一個人 – Ergec

這裏是另一個選擇，如果任何人發現它是有用的：http://suprb.com/apps/nested/

來源

2013-08-04 15:10:28

我想嘗試Salvattore，它使用CSS的配置和所有的設計，無需甚至觸摸JavaScript。

http://salvattore.com/

來源

2013-08-09 02:21:55

可悲的是它是IE 9+ – Ando

我用這個。它和Bootstrap很好。基本上而不是容器，我正在使用牆：

<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。如果你不喜歡400，你可以做數學和改變min-width.

來源

2013-10-17 19:50:41

Tnx，但在IE 9中怎麼樣 –

在這裏演示 - http://jsfiddle.net/wqnryqdv/ –

CSS系統替代砌體

回答

相關問題