title: Bootstrap two navbars collapsing
body: <p>In bootstrap I want to have two navbars below each other.
  My idea:<br />
  Navbar 1 has a brand: main menu.<br />
  Navbar 2 (below navbar1) has a brand called: sub menu.</p>
  <p>When the user looks at the site on his mobile phone he/she sees two collapsible navbars.
  The user can now choose which navbar to open. The menu or the sub menu.</p>
  <p>I just copied the standard code on the bootstrap website: <a href="http://getbootstrap.com/components/#navbar" rel="nofollow noreferrer">http://getbootstrap.com/components/#navbar</a></p>
  <p>Strange thing is. When i make my browser small. Two collapsed navbars appear. &quot;Main-menu&quot; and &quot;sub-menu&quot;.  When I click on the button behind main menu the main menu appears. Just like it should. But when I press the sub-menu (uncollapse) button. The MAIN-MENU opens again. Not the sub menu.</p>
  <p>I just used the standard navbar code from the bootstrap website in the link pasted those beneath each other and changed the brand names.</p>
  <p>HERE is the bootply: <a href="http://bootply.com/101690" rel="nofollow noreferrer">http://bootply.com/101690</a>
  Test it on mobile and see what happens in the navbars.</p>