Question

我可以将div的内容集中在中心块吗？

以下示例不起作用：

<div class="form-group">
    <div class="center-block">
            <input id="user_registrate" type="submit" value="Registrate" class="btn btn-success" />
    </div>
</div>

http://jsfiddle.net/jd93fL1x/2/

这个有效：

<div class="form-group">
    <div>
            <input id="user_registrate" type="submit" value="Registrate" class="btn btn-success center-block" />
    </div>
</div>

http://jsfiddle.net/jd93fL1x/3/

我想要两个按钮居中，这就是为什么我想要div与中心块。

Answer 1

班级center-block将中心应用于元素本身，而不是内容;在这种情况下，您可以在容器上使用类text-center，因为输入的类btn使其成为内联块，这将起作用：

<div class="text-center">
    <input id="user_registrate" type="submit" value="Registrate" class="btn btn-success" />
    <input id="user_registrate" type="submit" value="Registrate" class="btn btn-success" />
</div>

DemoFiddle

Answer 2

在div上使用text-align:center：

.center-block {
    text-align:center;
}

<强> jsFiddle example

（如果你没有使用该类，可以使用选择器.form-group > div代替.center-block

Answer 3

您可以简单地使用text-align：center

<div class="form-group">
<div style="text-align:center">
        <input id="user_registrate" type="submit" value="Registrate" class="btn btn-success" />
</div>

使用Bootstrap（中心块）居中div内容

3 个答案:

DemoFiddle