How to center action buttons of this webpage?

Question

I want to position both the buttons in the center, I've tried margin:0 auto 0 auto; to the position but it doesn't work (when i tried positioning with table instead of Div it worked.) but still I want to know why I can't able to center it using div.

Actual Web Page

                 <div class="col-md-9 col-sm-12 service-details">
                    <h1 class="website-banner">We Just Don't Create Websites, We Create Art.</h1>
                    <div class="button-container">
                        <button class="btn btn-lg btn-dark" type="button">
                            Build My Website
                        </button>

                        <button class="btn btn-lg btn-dark" type="button">
                            Work With Us
                        </button>
                    </div>

                </div>

Thanks.

`
` [documentation is helpful](https://getbootstrap.com/docs/). — Chris W., Jun 08 '20 at 14:57
Try adding the style `text-align:center` to your `.button-container` class. — Gamers Agenda, Jun 08 '20 at 15:07

score 1 · Answer 1 · answered Jun 08 '20 at 14:53

1

.button-container{
  display:flex;
  justify-content:center;
}

Or using bootstrap utility classes

<div class="button-container d-flex justify-content-center">

answered Jun 08 '20 at 14:53

Dima Vak

599
5
20

How to center action buttons of this webpage?

1 Answers1