title: Centering divs that span odd number of columns in bootstrap
body: <p>I am trying to center two of my divs in Bootstrap 3's grid.  The problem is, together they span 9 columns, which is an odd number of columns.  My first div spans 6 columns, and the second one spans 3 columns. This leaves me with 3 extra columns for whitespace, but I'm not able to figure out how to divide this up equally to the left and right. I can either have 2 empty columns on the left and 1 on the right or the other way round.</p>
  
  <p>For example, this gets left aligned:</p>
  
  <pre><code> &lt;div class="row"&gt;
                &lt;div class="col-md-2"&gt;&lt;/div&gt;
  
                &lt;div class="col-md-6"&gt;
                       &lt;div id="myFirstDiv"&gt;&lt;/div&gt;
                &lt;/div&gt;
  
                &lt;div class="col-md-3"&gt;
                       &lt;div id="mySecondDiv"&gt;&lt;/div&gt;
                &lt;/div&gt;  
  
                &lt;div class="col-md-1"&gt;&lt;/div&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p>If there was a way to make the first column 1.5 and the last 1.5, that would be have been perfect. Is there anything I can do to center my content?</p>
  
  <p>I have tried using center-block, but this doesn't seem to have any effect.</p>