title: Pushing column to next line with col-md-push-*
body: <p>I have the following 6 building blocks:</p>
  
  <pre><code>[1][2] 
  [3][4]
  [5][6]
  </code></pre>
  
  <p>All blocks have a col-sm-6 class in one row.
  But since block 3 exceeds bootstraps 12 columns structuur it will jump to the next line.
  Perfect that's what I want.</p>
  
  <p>The only thing is, I want to swap block 2 and 3.
  But it only works for blocks on the same line.
  So 1 and 2 can swap, but 2 and 3 not (in SM mode)</p>
  
  <pre><code> &lt;div class="container"&gt;
   &lt;div class="row"&gt;
      &lt;div class="col-sm-6 col-md-4"&gt;  
          &lt;div class="well"&gt; 1 &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="col-sm-6 col-sm-push-6 col-md-4 col-md-push-0"&gt;
          &lt;div class="well"&gt; 2 &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="col-sm-6 col-sm-pull-6 col-md-4 col-md-pull-0"&gt;
          &lt;div class="well"&gt; 3 &lt;/div&gt;
      &lt;/div&gt;
  
      &lt;div class="clearfix hidden-sm"&gt;&lt;/div&gt;
  
      &lt;div class="col-sm-6 col-md-4"&gt;
          &lt;div class="well"&gt; 4 &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="col-sm-6 col-md-4"&gt;
          &lt;div class="well"&gt; 5 &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="col-sm-6 col-md-4"&gt;
          &lt;div class="well"&gt; 6 &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>It will create:</p>
  
  <pre><code>    [1]   [2]
   [3]   [4]
      [5][6]
  </code></pre>
  
  <p>See 
  <a href="http://www.bootply.com/127062" rel="noreferrer">http://www.bootply.com/127062</a></p>