`render частичное: 'foo', коллекция: @ foos` без перевода строки`% br` между каждым `foo` - PullRequest
Новая
       2

`render частичное: 'foo', коллекция: @ foos` без перевода строки`% br` между каждым `foo`

0 голосов
/ 02 апреля 2012

у меня в моем app/views/bar/index.html.haml следующее 

%p= render partial: 'foo', collection: @foos

следующее в моем app/views/bar/_foo.html.haml частичном: 

.foo
  .title
    %h3= foo['name']
  .image¬
    = image_tag (foo['image'])['url']
  %p.description
    :erb
      <%= foo['description'] %>
  %span.price= number_to_currency foo['price'].to_i

и следующее в моей app/assets/stylesheets/bar.css.sass таблице стилей: 

.foo
  border: 2px solid black
  border-radius: 5px
  background: #FAF7F7
  text-align: center
  width: 30%
  li
    text-align: left
  img
    max-height: 90%
    max-width: 90%

и я получаю каждый .foo div на новой строке. Перерыв вызван css или haml или как я отрисовываю партиалы? Как мне настроить его так, чтобы многие .foo div отображались в одной строке, прежде чем новая будет отображаться в новой строке?

1 Ответ

1 голос
/ 02 апреля 2012

Я получаю каждый .foo div на новой строке.

div элементы являются элементами уровня блока. Для них display по умолчанию установлено значение block, что означает, что они не отображаются бок о бок или "встраиваются".

Если вы хотите, чтобы они отображались в строке, вам придется вручную заставить их делать это, либо плавая на них, либо установив для их свойства display значение inline.

Как мне настроить его так, чтобы многие .foo div отображались в одной строке, прежде чем новая отобразится в новой строке?

Вы хотите, чтобы ваши <div class="foo"> элементы плавали, используя что-то вроде следующего: 

div.foo
  float: left
...