title: Stacking Bootstrap Columns over each other
body: <p>I am using <strong>Bootstrap</strong> <code>v3</code> to develop my interface.<br>
  I use following snippet:  </p>
  
  <pre><code>    &lt;div class="row"&gt;
          &lt;div class="col-sm-4 col-xs-4"&gt;
              &lt;h1&gt;Hello...!&lt;/h1&gt;
              &lt;p&gt;Para 1&lt;/p&gt;
          &lt;/div&gt;
          &lt;div class="col-sm-8 col-xs-8"&gt;
              &lt;h1&gt;new div&lt;/h1&gt;
              &lt;p&gt;Para 2&lt;/p&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p>However, when I decrease the size(width) of browser, the columns get smaller and smaller.<br>
  I want that, after a certain limit or min-width, the divs must stack over one another instead of getting smaller.  </p>