Question

我希望能够将包含下面文本的div置于页面中间。我虽然可以在bootstrap中使用'center-block'类，但它似乎不起作用：

Code below:

 <div class="row">
      <div class="col-md-4 center-block text-center">

        I want to center the div that this text is in.I want to center the div that this text is in.I want to center the div that this text is in.I want to center the div that this text is in.I want to center the div that this text is in.I want to center the div that this text is in.I want to center the div that this text is in.I want to center the div that this text is in.I want to center the div that this text is in.I want to center the div that this text is in.

      </div>
    </div>

Answer 1

.col-md-4类导致它向左浮动而不是向中心浮动。如果要保持该类的宽度，可以在CSS中覆盖它：

.col-md-4.center-block {
    float: none;
}

更新了codepen：http://codepen.io/sdsanders/pen/lHrvu

Answer 2

你去吧

<div class="row">
      <div class="col-md-4 col-md-offset-4">

        I want to center the div that this text is in.I want to center the div that this text is in.I want to center the div that this text is in.I want to center the div that this text is in.I want to center the div that this text is in.I want to center the div that this text is in.I want to center the div that this text is in.I want to center the div that this text is in.I want to center the div that this text is in.I want to center the div that this text is in.

      </div>
    </div>

Bootstrap - 如何将包含文本的div居中？

2 个答案: