0

Ruby on Rails は初めてです。商品を 2 列で表示するにはどうすればよいですか?

次のように書くと、右の列には同じ商品が表示されますが、左の列と右の列にいくつかを表示したいです。

#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; }

必要に応じてパディングなどを追加します。

または、データベースから配列を取得した後に配列を分割し、コードを 2 回 (左の列で 1 回、右の列で 1 回) 実行することもできます。

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