Question

我在Bootstrap行中有一个元素。该元素在屏幕的xs，sm，md和lg配置上使用不同数量的列。当需要12列时，我需要元素在中间。可能吗？如果是这样我怎么能这样做？例如：

<div class="row">
<div class="col-xs-12 col-sm-12 col-md-6 col-lg-4">
    SOME TEXT
</div>
<div class="col-xs-12 col-sm-12 col-md-6 col-lg-4">
    SOME TEXT
</div>
<div class="col-xs-12 col-sm-12 col-md-6 col-lg-4">
    SOME TEXT
</div>

如果我将行放入一个流动的div中，我希望元素始终位于中间，但是当我将浏览器缩小到sm配置时，它会使一个元素本身占用12列，因此我有相对的差距左侧巨大的差距。

Answer 1

哦！在那里，我提出了这个想法，似乎很有效。我只是将一些css添加到一个带有列的元素：

margin:0 auto;

代码的作用实际上是将元素放在列中。

Answer 2

是的，@ GaneshRadhakrishnan是对的，你应该像这样使用bootstrap的center-text类：

<div class="row">
    <div class="col-xs-12 col-sm-12 col-md-6 col-lg-4 center-text">
        SOME TEXT
    </div>
    <div class="col-xs-12 col-sm-12 col-md-6 col-lg-4 center-text">
        SOME TEXT
    </div>
    <div class="col-xs-12 col-sm-12 col-md-6 col-lg-4 center-text">
        SOME TEXT
    </div>
</div>

在bootstrap中需要12列时居中div

2 个答案: