我正在尝试创建一个包含三列的无序列表，显示为：

item      item      item
item      item      item
item      item      item
item      item      item
item

相反，我得到了一个如下所示的列表：

item      item      item
item      item      item
item      item      item
item      item      item
          item

除了看起来更糟糕，因为列是水平居中的。在css文件中：

ul.three-cols {
  -webkit-column-count: 3;
  -moz-column-count: 3;
  column-count: 3;
}

如何使项目在顶部对齐，同时使列表首先填充第一列？
编辑：这是html.erb文件中的代码：

<ul class="three-cols">
          <% @birds.each do |bird| %>
            <li>
              <h5><%= link_to bird.name, bird_path(bird) %></h5>
            </li>
          <% end %>
        </ul>