Bootstrap 4 center-block unable to center

Question

I have the following bootstrap html code (its JSX hence the className but the idea is the same):

        
                      

              相关标签:
       
      

Answer 1

btn-group has display:inline-block so you would use text-center in the parent container..

http://codeply.com/go/hyUYkUrtRN

NOTE: In Bootstrap 4, center-block is now mx-auto, representing margin: 0 auto; for centering display:block elements. Bootstrap 4 now has a d-block class too so an inline element can be made display:block like this..

<img src=".." class="d-block mx-auto" >

Also see: Center the content inside a column in Bootstrap 4

Answer 2

Bootstrap 4 does not have center-block Instead, I use d-block mx-auto which sets display to block, and left and right margins to auto.

Answer 3

Bootstrap 4 (as of 2017-08-16) will use d-block and to center you use mx-auto.