Блог

Я хочу создать страницу продукта, на которой есть несколько столбцов. Проблема, с которой я сталкиваюсь, используя следующее, заключается в том, что если у меня нечетное количество продуктов, то столбец переходит к следующему столбцу. Я читал, что с этим связана ошибка с использованием CSS 3.

Мой вопрос в том, как я могу создать этот сетчатый список продуктов в rails? Я пытался использовать таблицу, но она просто отображает ее в одном столбце. Спасибо

 div.four-column {
  -moz-column-count: 4;
  -webkit-column-count: 4;
  column-count: 4;

  -moz-column-width: 10em;
  -webkit-column-width: 10em;
  column-width: 10em;

  width: 910px;
}


<ul>
  <% @products.each do |product| %>
    <li class="box">
      <%= link_to product.name, product_path(:id) %></br>
      <%= product.price %>
    </li>
  <% end %>
</ul>
  

я бы предложил попробовать css-фреймворк для такого макета

Grid960

или

Twitter bootstrap

Вы можете делать то, что хотите, очень легко.

Попробуйте и скажите мне, что вы думаете.

Кстати, в вашем примере вы показываете код своего CSS для div с классом four-column, но ниже ваш erb, похоже, пропускает этот div с этим определением класса? все, что я вижу, это div с class=»box»!