jquery - 使用 Twitter Bootstrap 时 Rails 中 Masonry 的问题。

Question

这是我的网站目前的样子的 JSFiddle:https://jsfiddle.net/4u4xx1yg/

div 之间有一个空白空间，这就是为什么我试图使用 Masonry 使 div 看起来像这样:

我将 Bootstrap 与 Rails 4 结合使用。我正在使用 each_slice() 创建两列。我尝试了以下，使用 Masonry Rails gem , 但它还不起作用:

<div id="masonry-container">
    <% @projects.each_slice(2) do |projects| %>
        <div class="col-md-6 box">
            <% projects.each do |project| %>
                  <p><%= project.name %></p>
            <% end %>
       </div>
    <% end %>
</div>

然后我将其添加到 application.js 中:

$(function(){
  $('#masonry-container').masonry({
      itemSelector: '.box',
  });
});

我在使用 Masonry 时做错了什么？

在 application.js 中，我有:

//= require masonry/masonry.min

在 application.css.scss 中，我有:

/*
*= require 'masonry/basic'
*/

Answer 1

我通过编辑以下的 CSS 使其工作:

#masonry-container {
  margin: 0 auto;
}

.box {
  width:450px;
}