title: Fluid row div stacking order - columnize when possible
body: <p>I have the following stacking order for my footer</p>
  
  <pre><code>span2 |     span 8    | span2
  </code></pre>
  
  <p>If I halve the screen size, the stacking order is as follows:</p>
  
  <pre><code>|     span 8    |
  |     span 2    |
  |     span 2    |
  </code></pre>
  
  <p>But I want them to stack like this and I know there is enough space for 'span2's:</p>
  
  <pre><code>|     span 8    |
  | span2 | span2 | 
  </code></pre>
  
  <p>How can I achieve this? I tried appending <code>col-sm-6</code> to each <code>span2</code>, but with no luck (Boostrap <a href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0-wip/js/bootstrap.min.js" rel="nofollow">3.0.0-wip</a> and <a href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.1/css/bootstrap.no-icons.min.css" rel="nofollow">2.2.1 no-icon</a>)</p>