css - 显示电话号码的无序列表

Question

我创建了一个 block 来遍历数据库并获取所有数字并将它们显示在无序列表中，但它们都在同一行返回，就像它们都是一个元素一样。我觉得 block 应该自动将它们分开？

`<h1>Listing Numbers</h1>
  <div class='from-group'>
    <ul>
      <li class="numbers">
        <% @people.each do |person| %>
          <%= person.phone_number %>
        <% end %>
      </li>
    </ul>
  </div>
`

Answer 1

我认为正在发生的事情是所有数字都在一个li上，而不是单个li...

看区别:

<h1>Listing Numbers</h1>
<div class='from-group'>
  <ul>
    <li class="numbers">
      Item 1 Item 2 Item 3 (we're all in the same li)
    </li>
  </ul>

</div>

<h1>Listing Numbers</h1>
<div class='from-group'>
  <ul>
    <li class="numbers">Item 1 Separate li</li>
    <li class="numbers">Item 2 Separate li</li>
    <li class="numbers">Item 3 Separate li</li>
  </ul>

</div>