0

我是 Ruby on Rails 的新手。如何在两列中显示产品？

当我写以下内容时，右列会显示相同的产品，但我想在左列显示一些，在右列显示一些。

#main_container  
.left_col

%div{"data-hook" => "___homepage_featured_products"}

%h3

   Featured Activities
 - @featured.each do |pr|
   - @product = pr
   %a.box{:href=>url_for(@product), :title=>"#{@product.name} | #{@product.location}"}
     - if @product.images[0]
       .img{:style=>"background-image: url('#{@product.images[0].attachment.url(:original)}')"}
       .details
         %h3
           = @product.name.truncate 20
         %p.infos
           = image_tag @product.activity_type.icon, :class=>"pictogram" rescue ''
           %span= @product.activity_type.name.titleize rescue ''
           \/
           %span.price= number_to_currency @product.price rescue ''
           \/
           = @product.location
           \/
           = @product.level
         %p
           = @product.description.truncate(120) rescue ''

.right_col
4

1 回答 1

1

您可以将每个产品放入自己的 div 中，然后使用 CSS 将它们浮动到左侧，这样最多 2 个框会水平相邻出现。这将产生 2 列布局的效果。举个例子：

#main_container { width: 900px; }
.featured_product { width: 450px; float: left; }

根据需要添加填充等。

或者，您可以在从数据库中检索数组后拆分数组并运行代码两次，一次在左列，一次在右列：

@left, @right = @featured.in_groups_of((@featured.count / 2.0).ceil, false)
于 2013-02-09T09:49:07.300 回答