title: Using Pull Push, columns are not interchanging their place in mobile view
body: <p>I have 3 columns in a row: 8, 4 and 12. In mobile view, I want to interchange the position of 4 and 12
  <a href="https://i.stack.imgur.com/zSMPO.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/zSMPO.png" alt="enter image description here"></a></p>
  
  <pre><code>&lt;div class="container-fluid"&gt;
    &lt;div class="row"&gt;
      &lt;div class="col-sm-4"&gt;Col 1&lt;/div&gt;
      &lt;div class="col-sm-8 col-xs-12 col-xs-push-12"&gt;Col 2&lt;/div&gt;
      &lt;div class="col-sm-12 col-xs-12 col-xs-pull-12"&gt;Col 3&lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>The above code removes the responsiveness even in desktop view.</p>
  
  <p>I need second column to be in third place and 3rd column to be in second place in mobile view</p>