title: Bootstrap - how to change order of displaying columns
body: <p>I have problem with ordering colums on sm and xs large on bootstrap. I'd like to change ordering from "1","2","3" to "1","3","2" on sm and xs resolutions:</p>
  
  <p><a href="http://imageshack.com/a/img923/8600/DF8LGA.png" rel="nofollow">http://imageshack.com/a/img923/8600/DF8LGA.png</a></p>
  
  <p>I tried to set col-xs-push-12 to "2" column and col-xs-push-12 to "3" column but it doesn't work. Please help me.</p>
  
  <p>Here are my files:
  <a href="http://www.speedyshare.com/6B6Fv/public-html.rar" rel="nofollow">http://www.speedyshare.com/6B6Fv/public-html.rar</a></p>
  
  <p>and code:</p>
  
  <pre><code>      &lt;div class="header-bot"&gt;
          &lt;div class="container"&gt;
              &lt;div class="row"&gt;
                  &lt;div class="col-sm-2"&gt;
                      &lt;a class="logo-1 hidden-sm hidden-xs" href="index.html"&gt;
                          &lt;img src="img/logo-md.png" alt="Logo"/&gt;
                      &lt;/a&gt;
                      &lt;a class="visible-sm" href="index.html"&gt;
                          &lt;img src="img/logo-sm.png" alt="Logo"/&gt;
                      &lt;/a&gt;
                      &lt;a class="visible-xs" href="index.html"&gt;
                          &lt;img src="img/logo-xs.png" alt="Logo"/&gt;
                      &lt;/a&gt;
                  &lt;/div&gt;
                  &lt;div class="col-md-7 col-sm-12 col-xs-push-12"&gt;
                      &lt;nav class="navbar navbar-default"&gt;
                          &lt;div class="navbar-header"&gt;
                              &lt;button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false"&gt;
                              &lt;span class="sr-only"&gt;Toggle navigation&lt;/span&gt;
                              &lt;span class="hidden-xs icon-bar"&gt;&lt;/span&gt;
                              &lt;span class="hidden-xs icon-bar"&gt;&lt;/span&gt;
                              &lt;span class="hidden-xs icon-bar"&gt;&lt;/span&gt;
                              &lt;span class="visible-xs glyphicon glyphicon-menu-hamburger"&gt;&lt;/span&gt;
                              &lt;/button&gt;
                              &lt;p class="hidden-lg hidden-md"&gt;Menu&lt;/p&gt;
                          &lt;/div&gt;
                          &lt;div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"&gt;
                              &lt;ul class="ul-main nav navbar-nav navbar-right"&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;new&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;designers&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;women&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;men&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;clearence&lt;/a&gt;&lt;/li&gt;
                              &lt;/ul&gt;
                          &lt;/div&gt;
                      &lt;/nav&gt;
                  &lt;/div&gt;
                  &lt;div class="header-user col-md-3 col-sm-4 col-xs-pull-12"&gt;
                      &lt;div class="cart hidden-xs"&gt;
                          &lt;p&gt;Your cart&lt;/p&gt;
                      &lt;/div&gt;
                      &lt;div class="basket"&gt;
                          &lt;p&gt;0 Items | $ 0&lt;/p&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
       &lt;/div&gt;
  </code></pre>