CODEWITHSUNDEEP
csstwitter-bootstrap
Bitwise
Bitwise

Reputation: 8461

How to center a bootstrap well?

enter image description hereenter image description here I can't seem to get this well to align with the center of the page. It seems like it should be easy but I can't figure it out.

Upvotes: 0

Views: 7322

Answers (2)

maxwell
maxwell

Reputation: 2381

Bootstrap is based on a grid system of 12 columns. If you want the above message submission box centered I would place it in a column space of ~6 and have ~3 columns on each side of it like this:

<div class="row">
  <div class="col-xs-3">[Empty DIV]</div>
  <div class="col-xs-6">[Summision Box]</div>
  <div class="col-xs-3">[Empty DIV]</div>
</div>

Upvotes: 3

max
max

Reputation: 8687

You can use offset classes provided by Bootstrap

<div class="container">
  <div class="row">
    <div class="col-lg-6 col-lg-offset-3">
      <div class="well">
        Content
      </div>
    </div>
  </div>
</div>

CODEPEN

Upvotes: 5

Related Questions