html - Twitter Bootstrap 容器最大宽度折叠跨度

Question

更新
如果我放弃max-width，.container那么我的spans停靠点会正确排列。

<div class="container" style="max-width:940px">
  <div class="row">
    <div class="span4" style="background-color:#F00">1</div>
    <div class="span4" style="background-color:#F00">2</div>
    <div class="span4" style="background-color:#F00">3</div> 
    <div class="span4" style="background-color:#F00">4</div>  <!-- make a new line-->                
    <div class="span4" style="background-color:#F00">5</div>  
  </div>
</div>  

似乎我将跨度包裹在其中的任何东西都具有相同的效果。有没有办法解决这个问题？

现场预览在这里

Answer 1

这是因为 Bootstrap 的宽度为 12 列。

您的 3 第一个 div 有 4 + 4 + 4 列，因此在打印其他 div 之前会换行。

尝试减小宽度...以“span2”类为例，您会看到变化:)

Answer 2

Bootstrap 运行一个 12 列的 CSS 网格系统，你在一行中有 5 * span4，一行只能包含 3 * span4，然后它会换行到新行。

如果您想要一个实心行，请记住 spanX 的总和不能大于 12

请参阅： http: //getbootstrap.com/css/#grid-example-basic