html - 使用 Bootstrap 3.2.0 居中对齐多个按钮

Question

我知道这个问题已经被问了很多关于居中按钮或 div 的问题，但我找不到多个按钮/div 的答案。

我的设计中有几个部分需要 2 或 3 个按钮居中对齐，它们之间的边距为 10 像素，我还要求它们跨越 2 列。我将粘贴下面我正在使用的代码，希望你们中的一位能够告诉我我在哪里犯了错误，提前致谢。

<div class="container">
        <div class="row">
            <div class="col-lg-2 col-lg-offset-3 sec-1-btn">More</div>
            <div class="col-lg-2 sec-1-btn">More</div>
            <div class="col-lg-2 sec-1-btn">More</div>
        </div>
    </div>

@mixin btns {
    background: $yellow;
    color: $cream;
    font-weight: 700;
    font-size: 1.3em;
    text-transform: uppercase;
    text-align: center;
    padding: 12px 0;
}

我尝试向按钮添加 margin-right: 10px ，但由于第一个按钮卡在其位置，它们没有居中。我也尝试过使用 center-block 类，但似乎无法让它工作。我确信我不是唯一一个遇到这个问题的人，可能只是我没有看到明显的问题。再次提前致谢。

Answer 1

使用 Bootstrap 的 text-center 类..

<div class="container">
  <div class="row">
    <div class="col-lg-2 col-lg-offset-3 sec-1-btn text-center">More</div>
    <div class="col-lg-2 sec-1-btn text-center">More</div>
    <div class="col-lg-2 sec-1-btn text-center">More</div>
  </div>
</div>

http://www.bootply.com/cK0rmAOcXR