让div元素'浮动'

Question

我有一个由div元素填充的页面（由php生成）。所有的div都有随机边距，随机大小和随机颜色。其中有30个。

我想让这些div自己填充页面，所以有尽可能少的空白，这样就形成了一种难题。

这是我的html：

<div class="board"><!--30 divs with random styles and class="card--></div> 

和CSS：

div.card { 
    float: left; 
} 
div.board { 
    display: ; 
} 

我有什么，以填补在显示属性？我尝试了很多，并且run-in适合最好的但它仍然不会产生“谜题”效果。

在此先感谢。

Answer 1

纯HTML和CSS，你可以尝试做所有div：

div { 
    display: inline-block; 
    margin: 0; 
} 

除了我的div大小不同的想象你仍然会得到他们之间的空白。

对于只有最小空白的真正平铺布局，您可能需要考虑MASONRY。