这是我的网站目前的样子的 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'
*/
最佳答案
我通过编辑以下的 CSS 使其工作:
#masonry-container {
margin: 0 auto;
}
.box {
width:450px;
}
关于jquery - 使用 Twitter Bootstrap 时 Rails 中 Masonry 的问题。,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28471901/