How to align button to center using Bootstrap

One Bootstrap's most powerful features is nesting row elements. Every col-* container can have another row inside it, which then provides another full set of 12 col spaces:

<div class="col-lg-12">
    <div class="row">
        <div class="col-xs-4">
            <button class="btn btn-primary btn-sx" type="button">Confirm</button>
        </div>
        <div class="col-xs-4">
            <button class="btn btn-primary btn-xs" type="button">Middle Button</button>
        </div>
        <div class="col-xs-4">
            <button class="btn btn-primary btn-xs" type="button">Decline</button>
        </div>
    </div>
</div>

I'm not sure how your pull-* classes exactly work, but using Bootstrap's built-in grid system you should be able to get rid of those.

Don't miss the Bootstrap guide on nesting columns, as it provides way more information than this answer.


Use this option:

<div class="text-center">
    <button class="btn btn-primary btn-sx" type="button">
        Confirm
    </button>
</div>