html - 将 Bootstrap 与 Rails 结合使用 4. 为什么在 与 each_slice( ) 之间出现空白？

Question

我将 Bootstrap 与 Rails 4 结合使用。我正在使用 each_slice() 创建两列。但是，使用以下代码，我在左侧栏中得到了一个空的大空间。

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

为了进一步解释，我得到以下 html:

<div class="row">
    <div class="col-md-6">This is displayed on the left</div>
    <div class="col-md-6">This is displayed on the right</div>
    <div class="col-md-6">This is displayed on the right</div>
    <!-- Here there is a huge empty space, between the first and fourth div -->
    <div class="col-md-6">This is displayed on the left</div>
    <div class="col-md-6">This is displayed on the right</div>
    <div class="col-md-6">This is displayed on the left</div>
    <div class="col-md-6">This is displayed on the right</div>
    <div class="col-md-6">This is displayed on the left</div>
</div>

div 的长度不同。我怎样才能均匀地显示它们，有时在 div 之间没有很大的空间？我检查了所有的填充和边距，不是因为它们。

Answer 1

我认为问题在于第二个和第三个 div 之间没有“左”div。 each_slice 将一个数组分组为子数组，但我不明白将它们拆分为一个元素的组有什么意义，这就是您调用 @projects 时正在做的事情。每个切片(1)。这可以简化为

<% @projects.each do |project| %>
  <div class="col-md-6">
    <p><%= project.name %></p>
  </div>
<% end %>

但是，我不认为这是你的问题。如果您列出的不是您想要的，您实际上想要生成什么 html？