twitter-bootstrap div 上的引导中心进度条
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/26181507/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
bootstrap center progressbar on div
提问by DLeh
I'm trying to use a Bootstrap progress bar as a loading indicator, and I want the progress bar to be a certain width with the whole thing centered in the DIV. But the progress bar doesn't seem to like being centered.
我正在尝试使用 Bootstrap 进度条作为加载指示器，并且我希望进度条具有一定的宽度，并且整个内容都以 DIV 为中心。但是进度条似乎不喜欢居中。
When I do:
当我做：
<div class="text-center">
<img src="~/Content/Images/loading.gif" style="height:80px;" />
</div>
The image is centered properly. But when I substitute it for a progress bar, it goes to the left:
图像正确居中。但是当我用它代替进度条时，它会向左移动：
<div class="text-center">
<div class="progress" style="width:200px;"> <!-- set to certain width -->
<div class="progress-bar progress-bar-striped active" role="progressbar" style="width: 100%;">
<span>
Loading...
</span>
</div>
</div>
</div>
I want the progress bar to display centered.
我希望进度条居中显示。
回答by Marcelo
This bit of css worked for me.
这一点 css 对我有用。
.progress { margin-left: auto; margin-right:auto; }
回答by Zim
Or, you can just use Bootstrap's center-blockclass
或者，您可以只使用 Bootstrap 的center-block类
<div class="text-center">
<div class="progress center-block" style="width:200px;"> <!-- set to certain width -->
<div class="progress-bar progress-bar-striped active" role="progressbar" style="width: 100%;">
<span>
Loading...
</span>
</div>
</div>
</div>
