CODEWITHSUNDEEP
htmlcsstwitter-bootstrap
jazzblue
jazzblue

Reputation: 2437

How to center align button (or any div) in Bootstrap grid column?

Suppose I have a button that is inside a Bootstrap grid column. By default it is left-aligned in the column. How do I center align it? Thanks.

<div class="col-sm-2">
  <button type="button" class="btn btn-default">Delete selected PF</button>
</div>

Upvotes: 1

Views: 2656

Answers (1)

AndrewL64
AndrewL64

Reputation: 16301

Just add the text-center class to the element's parent div like this:

<div class="col-sm-2 text-center">
  <button type="button" class="btn btn-default">Delete selected PF</button>
</div>

Here's a jsfiddle with the above codes: http://jsfiddle.net/AndrewL32/65sf2f66/48/

Q. What is the text-center class in bootstrap?

A. text-center is the default bootstrap class for centering elements within that class.

Upvotes: 1

Related Questions