css - 如何在 Twitter Bootstrap 中将两个跨度居中？

Question

我无法让两个 span6 div 在 Bootstrap 中居中。我将这两个 div 放在容器流体内的一行中，但所有内容都粘在左边。我希望两个 div 彼此相邻显示并尽可能居中，但如果屏幕太小，我希望第二个跨度位于第一个跨度下方。

如有任何帮助，我们将不胜感激。

Answer 1

默认情况下，您的标记需要如下所示:

<div class="container-fluid">
    <div class="row">
        <div class="span6"></div>
        <div class="span6"></div>
    </div>
</div>

或者:

<div class="span12">
    <div class="row">
        <div class="span6"></div>
        <div class="span6"></div>
    </div>
</div>

为了使第二个 .span6 出现在第一个下方，您可能需要使用 media queries更改 .container-fluid 容器的大小并为 .span* 类提供最小宽度 - 这样最终当容器宽度不足以容纳两者时.span6 元素第二个强制低于第一个。