title: Bootstrap 3: Push/pull columns over rows
body: <p>i have the layout on mobiles like that:</p>
  
  <pre><code> --------- 
  |    1    |  
   --------- 
  |    2    |  
   --------- 
  |    3    |  
   --------- 
  </code></pre>
  
  <p>for larger screens, i want to have it like that:</p>
  
  <pre><code> -----------------------------------
  |        1               |     3    |
   -----------------------------------
  |                 2                 |
   -----------------------------------
  </code></pre>
  
  <p>Code, which does not work, because pull/push over one row :-(</p>
  
  <pre><code>&lt;div class="row clearfix"&gt;
      &lt;div class="col-sm-9 alert alert-info"&gt;
          1
      &lt;/div&gt;
      &lt;div class="col-sm-3  col-sm-push-3 alert alert-warning"&gt;
           2
      &lt;/div&gt;
      &lt;div class="col-sm-3 col-sm-pull-3 alert alert-debug"&gt;
           3
      &lt;/div&gt;
  &lt;/div&gt;  
  </code></pre>
  
  <p><a href="http://jsfiddle.net/QtPd2/27/">http://jsfiddle.net/QtPd2/27/</a></p>