title: What is the difference between push and offset under the grid system?
body: <p>I'm trying to understand the difference between push and offset in Bootstrap grids. For example the only difference between the two rows below is the third column in each. One uses a push and the other uses an offset. However, they both render exactly the same.</p>
  
  <pre><code>&lt;div class="row"&gt;
      &lt;div class="col-md-2"&gt;
          &lt;h2&gt;Column 1&lt;/h2&gt;
          &lt;p&gt;
              This is text for column 1
          &lt;/p&gt;
          &lt;p&gt;&lt;a class="btn btn-default" href="http://go.microsoft.com/fwlink/?LinkId=301865"&gt;Learn more &amp;raquo;&lt;/a&gt;&lt;/p&gt;
      &lt;/div&gt;
      &lt;div class="col-md-2"&gt;
          &lt;h2&gt;Column 2&lt;/h2&gt;
          &lt;p&gt;This is text for column 2&lt;/p&gt;
          &lt;p&gt;&lt;a class="btn btn-default" href="http://go.microsoft.com/fwlink/?LinkId=301866"&gt;Learn more &amp;raquo;&lt;/a&gt;&lt;/p&gt;
      &lt;/div&gt;
      &lt;div class="col-md-2 col-md-push-6"&gt;
          &lt;h2&gt;Column 3&lt;/h2&gt;
          &lt;p&gt;This is text for column 3&lt;/p&gt;
          &lt;p&gt;&lt;a class="btn btn-default" href="http://go.microsoft.com/fwlink/?LinkId=301867"&gt;Learn more &amp;raquo;&lt;/a&gt;&lt;/p&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  
  &lt;div class="row"&gt;
      &lt;div class="col-md-2"&gt;
          &lt;h2&gt;Column 1&lt;/h2&gt;
          &lt;p&gt;
              This is text for column 1
          &lt;/p&gt;
          &lt;p&gt;&lt;a class="btn btn-default" href="http://go.microsoft.com/fwlink/?LinkId=301865"&gt;Learn more &amp;raquo;&lt;/a&gt;&lt;/p&gt;
      &lt;/div&gt;
      &lt;div class="col-md-2"&gt;
          &lt;h2&gt;Column 2&lt;/h2&gt;
          &lt;p&gt;This is text for column 2&lt;/p&gt;
          &lt;p&gt;&lt;a class="btn btn-default" href="http://go.microsoft.com/fwlink/?LinkId=301866"&gt;Learn more &amp;raquo;&lt;/a&gt;&lt;/p&gt;
      &lt;/div&gt;
      &lt;div class="col-md-2 col-md-offset-6"&gt;
          &lt;h2&gt;Column 3&lt;/h2&gt;
          &lt;p&gt;This is text for column 3&lt;/p&gt;
          &lt;p&gt;&lt;a class="btn btn-default" href="http://go.microsoft.com/fwlink/?LinkId=301867"&gt;Learn more &amp;raquo;&lt;/a&gt;&lt;/p&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>