Bootstrap 3 & Masonry : 设置四列

Question

我正在尝试将 Masonry 与 Bootstrap 3 集成。我的目标是连续显示 4 项 。

没有Masonry它显示4个项目，但合并Masonry后它显示3个项目。

这是我所做的 js fiddle link

JSFIDDLE Link : http://jsfiddle.net/7Lptygkn/1/

Link 到砌体选项：http://masonry.desandro.com/options.html

我在初始化中设置了以下选项：

$(document).ready(function () {
    var $container = $('#feed-list');
    $container.masonry({
        itemSelector: '.feed',
        columnWidth: '.feed',
        transitionDuration: 0
    });
});

如有任何帮助，我们将不胜感激。提前致谢。

Answer 1

改变这个：<div id="feed-list" class="col-xs-12">

为此：<div id="feed-list" class="row">

在这里 fiddle 工作：http://jsfiddle.net/e8qf2cmt/

这里也有一个很好的标签示例：http://codepen.io/SitePoint/pen/mywEMR/

Bootstrap 3 & Masonry : 设置四列

Bootstrap 3 & Masonry : Setting four colums

jquery

html

css

twitter-bootstrap

jquery-masonry