title: Bootstrap Push/Pull Issues
body: <p>I'm fairly new to Bootstrap, and am having issues getting the alignment of elements to change right using <code>push</code> and <code>pull</code>. Here is the desired result for small screen sizes (<code>xs</code> and above):</p>
  
  <pre><code>-------------------
  |     Search      |
  -------------------
  |    Directory    |
  -------------------
  |   Preferences   |
  -------------------
  </code></pre>
  
  <p>Then for all screens sized <code>md</code> and above, I want this layout:</p>
  
  <pre><code>-------------------
  |  Search  | Pref.|
  -------------------
  |    Directory    |
  -------------------
  </code></pre>
  
  <p>I've read that Bootstrap layouts should be designed mobile-first, so my code is as follows:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>.a {
    background-color: green;
  }
  .b {
    background-color: blue;
  }
  .c {
    background-color: red;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" rel="stylesheet" /&gt;
  &lt;div class="container"&gt;
    &lt;div class="row"&gt;
      &lt;div class="col-xs-12 col-md-7 a"&gt;Search&lt;/div&gt;
      &lt;div class="col-xs-12 b col-md-push-12"&gt;Directory&lt;/div&gt;
      &lt;div class="col-xs-12 col-md-5 c col-md-pull-7"&gt;Preferences&lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>Here's a <a href="http://www.bootply.com/pMNvBOC6a3" rel="noreferrer">Bootply</a> with my code. It works as expected for the small screens, with each <code>div</code> stacked in the correct order, but I can't figure out why <code>push</code> and <code>pull</code> are just moving elements left and right, not joining them as I thought they would (even when I mess with the number of columns to push/pull). Can anyone point me in the right direction?</p>