水平对中bootstrap 3进度条？

Question

我无法将两个进度条集中在两列中，与其他两行中使用的方式相同。

目前：

期望：

进度条代码：

<div class="row top-row">
                    <div class="col-md-6 text-center">
                        <div class="progress" style="width:120px;">
                            <div class="progress-bar" role="progressbar" aria-valuenow="70" aria-valuemin="0" aria-valuemax="100" style="width:70%">70%
                            </div>
                        </div>
                    </div>

                    <div class="col-md-6 text-center">
                        <div class="progress" style="width:120px;">
                            <div class="progress-bar" role="progressbar" aria-valuenow="70" aria-valuemin="0" aria-valuemax="100" style="width:70%">70%
                            </div>
                        </div>
                    </div>
                </div>

似乎有效的两个方格：

<div class="row top-row">
                    <div class="col-md-6 text-center">
                        <div class="charBox">img1</div>
                    </div>

                    <div class="col-md-6 text-center">
                        <div class="charBox">img2</div>
                    </div>
                </div>

顶行是.top-row {margin-top：20px;}只是为了距离行。

以与其他两行相同的方式将这些进度条居中的正确方法是什么？感谢一些帮助，谢谢！

Answer 1

如果我没记错的话，Bootstrap没有这个选项。本身可以通过将自己的类添加到元素然后为该类添加一些样式来实现。

您的col-md-6添加了另一个column-centered

类

然后在你的CSS中添加一些样式......

.column-centered {
   float: none;
   margin: 0 auto;
}