Twitter bootstrap 带砌体的引导3

我对使用twitter引导（新版本3.0.1）和流体容器以及jquery插件的网格有一个问题

默认情况下（1200px宽度），每行应该有3个元素。如果我从4个col-xs-3元素开始，一切都很好（参见注释中的示例）。但我的问题是从col-xs-6/col-xs-3/col-xs-3开始

问题可以在这里看到：

不起作用：

<div class="post col-xs-6">
            <img src="http://placehold.it/400x400" />
        </div>

        <div class="post col-xs-3">
            <img src="http://placehold.it/400x400" />
        </div>

        <div class="post col-xs-3">
            <img src="http://placehold.it/400x400" />
        </div>

        <div class="post col-xs-3">
            <img src="http://placehold.it/400x400" />
        </div>

        <div class="post col-xs-3">
            <img src="http://placehold.it/400x400" />
        </div>

        <div class="post col-xs-6">
            <img src="http://placehold.it/400x400" />
        </div>

工作正常：

<div class="post col-xs-3">
            <img src="http://placehold.it/400x400" />
        </div>

        <div class="post col-xs-3">
            <img src="http://placehold.it/400x400" />
        </div>

        <div class="post col-xs-3">
            <img src="http://placehold.it/400x400" />
        </div>

        <div class="post col-xs-3">
            <img src="http://placehold.it/400x400" />
        </div>

        <div class="post col-xs-6">
            <img src="http://placehold.it/400x400" />
        </div>

        <div class="post col-xs-3">
            <img src="http://placehold.it/400x400" />
        </div>

        <div class="post col-xs-3">
            <img src="http://placehold.it/400x400" />
        </div>

---

有什么想法吗？

尝试使用

ColumnWidth

参数。 将脚本更改为类似以下内容：

$(document).ready(function () {
    var container = $('#posts');

    container.masonry({
        gutter: 0,
        itemSelector: '.post',
        columnWidth: 3
    }); 
});

这似乎达到了预期的效果