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

我做了一个循环来遍历数据库并获取所有数字并将它们显示在无序列表上的代码，但是它们都回到同一行，就像它们都是一个项目一样。我觉得该块应该自动将它们分开？

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

最佳答案

我认为正在发生的是所有数字都在一个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>

关于css - 显示无序的电话号码列表，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/35820173/