title: bootstrap - Hide navbar on small screen?
body: <p>I have this structure:</p>
  
  <pre><code>&lt;div class="container"&gt;&lt;div class="row"&gt;
    &lt;div class="col-sm-10 col-xs-12"&gt;
      &lt;input id="searchBar"&gt;
    &lt;/div&gt;
    &lt;div class="col-sm-2"&gt;
      &lt;ul class="nav nav-pills nav-stacked"&gt;
        &lt;li&gt;&lt;a&gt;Item&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a&gt;Item&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a&gt;Item&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a&gt;Item&lt;/a&gt;&lt;/li&gt;
  
      &lt;/ul&gt;
    &lt;/div&gt;  
  &lt;/div&gt;&lt;/div&gt;
  </code></pre>
  
  <p>and I'm trying to hide the right navbar on mobile screens. I set it to xs-hidden, but it still shows up.</p>
  
  <p>Is there a way to hide a navbar on xs screens?</p>