twitter-bootstrap BootStrap CSS边距0自动不居中
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/20085464/
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 CSS margin 0 auto not center
提问by user3001055
I'm currently using BootStrap 3. Well I can't make the button group center.
我目前正在使用 BootStrap 3。好吧，我无法将按钮组设为中心。
HTML
HTML
<div class="container" style="margin-top:100px;">
<div class="btn-group" style="margin:0 auto">
<button type="button" class="btn btn-default" >Left</button>
<button type="button" class="btn btn-default" >Middle</button>
<button type="button" class="btn btn-default" >Right</button>
</div>
</div>
How can I fixed that ?
我该如何解决？
采纳答案by davidpauljunior
EDIT: Guillemo Mansilla's answer is better. Same technique but better use of existing Bootstrap classes.
编辑：Guillemo Mansilla 的回答更好。相同的技术，但更好地利用了现有的 Bootstrap 类。
You can set text-align: centeron the .container. No need for the margin: 0 auto.
您可以text-align: center在.container. 不需要margin: 0 auto.
.container {
text-align: center;
margin-top: 100px;
}
回答by Guillermo Mansilla
You don't need to use inline styles, just apply the class "text-center" which is already included in bootstrap
您不需要使用内联样式，只需应用已包含在 bootstrap 中的“text-center”类
回答by jso1919
Bootstrap 4 use
Bootstrap 4 使用
Use text-centeror mx-autoor container-fluid
使用text-center或mx-auto或container-fluid
You could use this hack
text-center(this does not only apply for text)Or use the exact boostrap4 class
mx-auto
您可以使用此 hack
text-center（这不仅适用于文本）或者使用确切的 boostrap4 类
mx-auto
example
class="text-center"or class="mx-auto"
例如
class="text-center"或 class="mx-auto"
in context
在上下文中
<div class="btn-group text-center"> or <div class="btn-group mx-auto">
TRY NOT TO USEinline styles (bad practice)
尽量不要使用内联样式（不好的做法）
<div class="btn-group" style="margin:0 auto">
References here:
参考这里：
text-center=>
https://getbootstrap.com/docs/4.0/utilities/text/
text-center=>
https://getbootstrap.com/docs/4.0/utilities/text/
mx-auto=> https://getbootstrap.com/docs/4.0/utilities/spacing/#horizontal-centering
mx-auto=> https://getbootstrap.com/docs/4.0/utilities/spacing/#horizontal-centering
