html - BootStrap CSS 边距 0 自动不居中

Question

我目前正在使用 BootStrap 3。好吧，我无法让按钮组居中。

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>

我该如何解决？

Answer 1

Bootstrap 4 使用

使用text-center 或mx-auto 或container-fluid

1. 你可以使用这个 hack text-center(这不仅适用于文本)

2. 或者使用完全相同的 boostrap4 类 mx-auto

例子class="text-center" 或 class="mx-auto"

在上下文中

<div class="btn-group text-center"> or <div class="btn-group mx-auto">

尽量不要使用内联样式(不好的做法)

<div class="btn-group" style="margin:0 auto">

---

此处引用:

text-center => https://getbootstrap.com/docs/4.0/utilities/text/

mx-auto => https://getbootstrap.com/docs/4.0/utilities/spacing/#horizontal-centering