title: Column Ordering in Bootstrap3 - Push and Pull
body: <p>Using bootstrap 3 I have some questions about push/pull with column ordering. Here's what I am after:</p>
  
  <p><img src="https://i.stack.imgur.com/OwmWC.jpg" alt="enter image description here"></p>
  
  <p>I have this code:</p>
  
  <pre><code>&lt;div class="col-xs-10 col-sm-3 col-md-2"&gt;
          Column 1
      &lt;/div&gt;
      &lt;div class="col-xs-10 col-sm-3 col-md-2"&gt;
          Column 2
      &lt;/div&gt;
      &lt;div class="col-xs-10 col-sm-3 col-md-2"&gt;
          Column 3
      &lt;/div&gt;
      &lt;div class="col-xs-10 col-sm-9 col-md-4"&gt;
          Purple box.
      &lt;/div&gt;
      &lt;div class="col-xs-2 col-sm-3 col-md-2"&gt;
          Orange box.
      &lt;/div&gt;
  </code></pre>
  
  <p>If I add the pull modifier class to the purple box for sm/xs and push to the three columns, it produces strange results. Can someone tell me what I'm missing?</p>