Question

我正在尝试将两个列放在一个容器中：

<div class="container">
<div class="row">
    <div class="col-md-5">
    ...
    </div>
    <div class="col-md-3">
    </div>
</div>
</div>

但是我在左侧得到了所有的div。我知道这两列都是8列，所以我缺少其中的4列，但是我怎么能忽略这4列而只是集中我的容器？我知道如何使用简单的CSS进行此操作，但我更好地使用bootstrap处理它以使其响应。

Answer 1

试试这个：

<div class="container">
<div class="row">
    <div class="col-md-5 col-md-offset-2">
    ...
    </div>
    <div class="col-md-3">
    </div>
</div>
</div>

由于你有4列额外的，你需要从左边移动2列（ col-md-offset-2 ）。

Answer 2

您可以使用Offsetting columns执行此操作reference link

阅读并DIY。

例如

<div class="row">
    <div class="col-md-5 col-md-offset-2">
        <p>Here Comes Content</p>
    </div>
    <div class="col-md-3">
        <p>Here Comes Content</p>
    </div>
</div>

Answer 3

如果使用引导程序4，则可以使用.row .justify-content-md-center来使列居中对齐。

<div class='row justify-content-md-center'>

 <div class='col-lg-4 col-md-4 col-12'>
  Some text here...
 </div>

 <div class='col-lg-4 col-md-4 col-12'>
  Some text here...
 </div>

<div>

使用bootstrap中心两列

3 个答案: