title: Bootstrap 3: Can a nav-pills nav menu collapse like navbar?
body: <p>I understand that Bootstrap 3 ships with a navbar that collapse when viewed on smaller screens. However, I do not like the look of the navbar and have decided to style my main navigation menu using the <code>nav-pills</code> class. Is it possible to collapse my nav-pills menu when viewing it on a phone device? Here's my nav code:</p>
  
  <pre><code>&lt;nav&gt;
      &lt;ul class="nav nav-pills"&gt;
          &lt;li&gt;&lt;a href="#"&gt;&lt;strong&gt;HOME&lt;/strong&gt;&lt;/a&gt;&lt;/li&gt;
          &lt;li class="active"&gt;&lt;a href="#"&gt;&lt;strong&gt;CAPABILITIES&lt;/strong&gt;&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="#"&gt;&lt;strong&gt;Careers&lt;/strong&gt;&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="#"&gt;&lt;strong&gt;Contracts&lt;/strong&gt;&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="#"&gt;&lt;strong&gt;About Us&lt;/strong&gt;&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="#"&gt;&lt;strong&gt;News&lt;/strong&gt;&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="#"&gt;&lt;strong&gt;Contact us&lt;/strong&gt;&lt;/a&gt;&lt;/li&gt;
      &lt;/ul&gt;
  &lt;/nav&gt;
  </code></pre>