html - 如何删除 Bootstrap 滚动条之间的空间？

Question

我正在尝试制作带有 Bootstrap 进度条的条形图。但问题是每两个进度条之间有一个空格。我想让他们互相联系。这是我的一个进度条代码。

<div class="progress">
 <div class="progress-bar progress-bar-success" role="progressbar" style="width: 40%">
  <span class="sr-only">40% Complete (success)</span>
 </div>
</div>

我怎样才能做到这一点？

更新这是我的完整代码

<div>   
    <div class="progress">
        <div class="progress-bar progress-bar-success" role="progressbar" style="width: 40%">
            <span class="sr-only">40% Complete (success)</span>
        </div>
    </div>
    <div class="progress">
        <div class="progress-bar progress-bar-warning" role="progressbar" style="width: 65%">
            <span class="sr-only">40% Complete (success)</span>
        </div>
    </div>

Answer 1

问题是默认情况下 bootstrap 具有以下样式:

.progress {
    margin-bottom:20px;
}

您可以通过添加自己的样式表来覆盖它:

.progress {
    margin-bottom:0;
}

modified jsfiddle