css - 如何让我网站上的框堆叠成两列？

Question

关于 my website我有几个 block ，其中动态生成来自不同站点的信息，导致我无法/不想控制这些 block 出现的顺序。现在我希望它们堆叠在左列或右列中，具体取决于哪里有空间。

为了澄清，我拟定了它的外观和我希望它的外观，但该网站不允许我发布它们，所以我希望我的描述足够清楚(如果没有，图片是

http://i.stack.imgur.com/78R5d.png

和

http://i.stack.imgur.com/T51aP.png

现在是这样的，当右边一列的盒子总数比左边的盒子略高时，左边会出现一个新的盒子，但是上面会留一些空白来补偿高度差。如果右侧的框不会挡住左侧的框，那就太好了。

现在，如果不向每个盒子添加一些特定的类，恐怕这是不可能的，但你永远不知道人们会想出什么聪明的解决方案:)

Answer 1

有几种使用 Javascript 进行布局的问题的解决方案。其中之一是 Masonry ，这是一个 jQuery 插件。您只需要做一些基本的 CSS:

.item {
    float: left;
    width: 200px;
}

然后是这样的:

$('#container').masonry({
    itemSelector : '.item',
    columnWidth : 240
});

当然，您使用的选项可能会有所不同。