如何在bootstrap中设置按钮网格？

Question

我想要显示大约20个按钮。 （http://radio.meteor.com/.）的广播电台

以下是Meteor / Handlebar HTML现在的样子：

<div id="channels" class="span12">
  <div class="btn-group">
    {{#each channels}}
    <button class="btn {{#if playing}}btn-primary{{/if}}" id="channel-{{name}}">
      {{name}}
    </button>
    {{/each}}
  </div>
</div>

我希望按钮可以在垂直方向和水平方向上移动。我认为btn-group会很好，但我的按钮会向左边移动。我徒劳地尝试了这个：

#channels button {
  float: left;
  width: 120px;
}

Answer 1

每个li设置为ul父级的宽度的100％，而不是通道li的css应该是：

#channels li {
   float: left;
   width: auto;
}