CSS布局充满随机大小的div

Question

  

可能重复：
  Any ideas on how I could implement a grid-view in CSS? - CSS

我正在尝试创建一个与我通常做的相反的布局。我有数百个随机大小的div，我想尽可能多地填写页面。作为一个快速的黑客，它可能看起来像这样：

|--------||-------------------||----||-----------|
|        ||        2          ||  3 ||     4     |
|   1    ||-------------------||    ||-----------|
|        ||-----------------|  |----|
|        ||                 ||---------|
|--------||        5        ||         |
|--------||                 ||    6    |
|    7   ||-----------------||         |
|        |                   |---------|
|--------|

我一直在玩浮球，但他们不会向上移动以填补空白。怎么办呢？

谢谢你们！

Answer 1

昨天也提出了这样的问题。解决方案是使用JQuery插件：Masonry。

Any ideas on how I could implement a grid-view in CSS? - CSS

Answer 2

使用jQuery Masonry plugin或：

您必须创建 列/基于网格的 系统。例如，div 1和7进入他们自己的父div，div 2和5进入他们自己的父div，3和6进入他们自己的父div，等等。

您可能对使用一些着名的网格系统感兴趣：

• 45+ CSS Grid Systems
• 4 CSS Grid Systems and Why

您还可以创建通道：

• Grid System Generator