How to Center a Single-Column Div Within a 12-Column Container in Bootstrap 3

Question

Can you explainHow to Center a Single-Column Div Within a 12-Column Container in Bootstrap 3?

Answer 1

Using Bootstrap's Offset Classes

Bootstrap 3 provides offset classes (col-md-offset-*) to push columns to the right, effectively centering them.

Example:

<div class="container">

  <div class="row">

    <div class="col-md-6 col-md-offset-3">

      <!-- Your content here -->

      <p>This div is centered within a 12-column container.</p>

    </div>

  </div>

</div>