Question

在Offsetting Columns的this page示例中，第一列包含col-sm-5，第二列具有相同的col-sm-5，但也包含偏移col-sm-offset-2。由于它们的自举网格列的总数是5+（5 + 2）= 12，因此这被假定为水平对齐小屏幕而不是垂直堆叠，如结果所示。为什么会这样？我甚至试图删除额外的偏移但没有任何改变。

<div class="container-fluid">
  <h1>Hello World!</h1>
  <p>Resize the browser window to see the effect.</p>
  <div class="row" style="background-color:lavender;">
    <div class="col-sm-5 col-md-6" style="background-color:lightgray;">.col-sm-5 .col-md-6</div>
    <div class="col-sm-5 col-sm-offset-2 col-md-6 col-md-offset-0" style="background-color:lightcyan;">.col-sm-5 .col-sm-offset-2 .col-md-6 .col-md-offset-0</div>
  </div>
</div>

Answer 1

对我来说似乎正如预期的那样工作，你是否试图瞄准最小的屏幕？如果是这样，请尝试-xs-而不是-sm - ？

当Bootstrap列的总列数等于12时，它们会垂直堆叠

1 个答案: