如何將divs用作網格？

Question

好的，所以我正在制作一個網站來顯示數據庫中的最后八個條目，並以網格格式顯示它們，但是網格顯示不正確，它們顯示如下： 1 ：

但我希望它們顯示類似以下內容：

我想在圖紙上再增加一個欄目。 而且，沒有什么東西應該保留在相同的列和行中，而是位於其上方的下面。 該代碼在我的jsfiddle上： http : //jsfiddle.net/PGdMd/

另外，由於每個div的內容文本將根據在mySQL數據庫中輸入的數據而變化，因此css需要響應。

<h1>Sorry it made me put this here</h1>

Answer 1

從相關問題中閱讀，似乎您想要jQuery的泥瓦匠 。 要么就是同位素 。

Answer 2

看看砌體。 這是一個jQuery插件，可以完成您想要做的事情以及更多其他事情。

http://osvaldas.info/responsive-jquery-masonry-or-pinterest-style-layout

Answer 3

您是否考慮過一些可用於輕松實現布局的CSS框架？ 藍圖，960網格，Twitter引導程序，基金會等。有很多3列實現可用，這不僅使此事情變得容易，而且總體上簡化了您的項目。