如何删除 bootstrap 进度条下方的空格

Question

如何删除或最小化进度条和字符串之间的间隙：

<div class='progress'><div class='progress-bar' role='progressbar' aria-valuenow='60' aria-valuemin='0' aria-valuemax='100' style='width: 80%;'></div></div>
<!--Here will be a huge whitespace, and needs to be removed-->
remove white space above this line

这是一个fiddle：http://jsfiddle.net/1ts9b5m4/

提前致谢！

Answer 1

使用style="margin-bottom:0px;"

<div class='progress' style="margin-bottom:0px;"><div class='progress-bar' role='progressbar' aria-valuenow='60' aria-valuemin='0' aria-valuemax='100' style='width: 80%;'></div></div>
<!--Here will be a huge whitespace, and needs to be removed-->
remove white space above this line

Answer 2

单靠保证金对我不起作用。我不得不覆盖进度条的 margin-bottom 和高度 CSS 属性。我将其放入一个小的 blade 文件中，并使用 @include 将其放置在使用进度条的表单的内容部分中。

在文件中 views/splitpieces/overridecss.blade.php:

<style>
.progress-bar{ 
    margin-bottom:0px;
    height:1%;
}
</style>

在表单中使用进度条：

@include('splitpieces.cssoverride')

对我来说，这必须在 @section('content') 内才能工作，否则 bootstrap CDN 胜过样式修饰符。

希望这对您有所帮助。

如何删除 bootstrap 进度条下方的空格

how to remove the whitespace below the bootstrap progress bar

removing-whitespace

progress-bar

twitter-bootstrap-3