title: Two Row Navbar hamburger menu shrinks first row
body: <p>I'm using bootstrap to create a nav menu.  I want the basic nav to be the second row, and I want some misc. quick links to hang out as a top row.  </p>
  
  <p>After wrestling through a few examples and moshing them together I have a solution that seems to be working (see below) with one exception...</p>
  
  <p>As I collapse the the menu the top bar wraps the links just fine... as desired, however once I get the the hamburger menu for a small device my 2nd navbar pushes up and hides the top navbar items.  Grr... I just cant make that behavior stop.  </p>
  
  <p>Where should I be looking? </p>
  
  <pre><code>&lt;nav class="navbar navbar-inverse navbar-fixed-top"&gt;
  
          &lt;div id="topBar"&gt;
  
              &lt;div class="container"&gt;
  
                  &lt;div class="row"&gt;
  
                      &lt;div class="col-md-3 col-xs-12" &gt;
                          &lt;ul class="top-links list-inline"&gt;
                              &lt;li class="hidden-xs"&gt;&lt;a href="@Url.Action("Index", "Contact")"&gt;&lt;i class="fa fa-envelope"&gt;&lt;/i&gt; CONTACT&lt;/a&gt;&lt;/li&gt;
                              &lt;li class="hidden-xs"&gt;&lt;a target="_blank" href="https://get.teamviewer.com/xxxxx"&gt;&lt;i class="fa fa-medkit"&gt;&lt;/i&gt;Quick Support&lt;/a&gt;&lt;/li&gt;
                          &lt;/ul&gt;
                      &lt;/div&gt;
  
                      &lt;div class="col-md-9 col-xs-12"&gt;
                          @Html.Partial("_LoginPartial")
                      &lt;/div&gt;
  
  
  
                  &lt;/div&gt;
  
              &lt;/div&gt;
          &lt;/div&gt;
  
  
          &lt;div class="container"&gt;
  
                  &lt;div class="navbar-header"&gt;
                      &lt;button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"&gt;
                          &lt;span class="icon-bar"&gt;&lt;/span&gt;
                          &lt;span class="icon-bar"&gt;&lt;/span&gt;
                          &lt;span class="icon-bar"&gt;&lt;/span&gt;
                      &lt;/button&gt;
                      @Html.ActionLink("xxxxxxx.Net", "Index", new { controller = "Home" }, new { @class = "navbar-brand" })
                  &lt;/div&gt;
  
                  &lt;div class="collapse navbar-collapse navbar-ex1-collapse"&gt;
                      &lt;ul class="nav navbar-nav navbar-right"&gt;
                         ... menu stuff here removed for simplicity 
                      &lt;/ul&gt;
  
                  &lt;/div&gt;
  
                  &lt;div class="navbar-header navbar-lower" role="navigation"&gt;
              &lt;div class="container"&gt;
                  &lt;div class="collapse navbar-collapse collapse-buttons"&gt;
                      &lt;ul class="nav navbar-nav navbar-right"&gt;
                          &lt;li id="home"&gt;
                              @Html.ActionLink("Home2", "Index2", "Home")
                          &lt;/li&gt;
                          &lt;li id="about"&gt;
                              @Html.ActionLink("About", "Index", "About")
                          &lt;/li&gt;
                          &lt;li id="services"&gt;
                              @Html.ActionLink("Services", "Index", "Services")
                          &lt;/li&gt;
                          &lt;li id="contact"&gt;
                              @Html.ActionLink("Contact", "Index", "Contact")
                          &lt;/li&gt;
                          &lt;li id="portfolio" class="dropdown"&gt;
                              &lt;a href="#" class="dropdown-toggle" data-toggle="dropdown"&gt;Portfolio &lt;b class="caret"&gt;&lt;/b&gt;&lt;/a&gt;
                              &lt;ul class="dropdown-menu"&gt;
                                  &lt;li id="1columnportfolio"&gt;
                                      @Html.ActionLink("1 Column Portfolio", "OneColumn", "Portfolio")
                                  &lt;/li&gt;
                                  &lt;li id="2columnportfolio"&gt;
                                      @Html.ActionLink("2 Column Portfolio", "TwoColumn", "Portfolio")
                                  &lt;/li&gt;
                                  &lt;li id="3columnportfolio"&gt;
                                      @Html.ActionLink("3 Column Portfolio", "ThreeColumn", "Portfolio")
                                  &lt;/li&gt;
                                  &lt;li id="4columnportfolio"&gt;
                                      @Html.ActionLink("4 Column Portfolio", "FourColumn", "Portfolio")
                                  &lt;/li&gt;
                                  &lt;li id="singleportfolioitem"&gt;
                                      @Html.ActionLink("Single Portfolio Item", "SingleItem", "Portfolio")
                                  &lt;/li&gt;
                              &lt;/ul&gt;
                          &lt;/li&gt;
                          &lt;li id="blog" class="dropdown"&gt;
                              &lt;a href="#" class="dropdown-toggle" data-toggle="dropdown"&gt;Blog &lt;b class="caret"&gt;&lt;/b&gt;&lt;/a&gt;
                              &lt;ul class="dropdown-menu"&gt;
                                  &lt;li id="bloghome1"&gt;
                                      @Html.ActionLink("Blog Home 1", "Home1", "Blog")
                                  &lt;/li&gt;
                                  &lt;li id="bloghome2"&gt;
                                      @Html.ActionLink("Blog Home 2", "Home2", "Blog")
                                  &lt;/li&gt;
                                  &lt;li id="blogpost"&gt;
                                      @Html.ActionLink("Blog Post", "Post", "Blog")
                                  &lt;/li&gt;
                              &lt;/ul&gt;
                          &lt;/li&gt;
                          &lt;li id="other" class="dropdown"&gt;
                              &lt;a href="#" class="dropdown-toggle" data-toggle="dropdown"&gt;Other Pages &lt;b class="caret"&gt;&lt;/b&gt;&lt;/a&gt;
                              &lt;ul class="dropdown-menu"&gt;
                                  &lt;li id="fullwidthpage"&gt;
                                      @Html.ActionLink("Full Width Page", "FullWidth", "Other")
                                  &lt;/li&gt;
                                  &lt;li id="sidebarpage"&gt;
                                      @Html.ActionLink("Sidebar Page", "Sidebar", "Other")
                                  &lt;/li&gt;
                                  &lt;li id="faq"&gt;
                                      @Html.ActionLink("FAQ", "Faq", "Other")
                                  &lt;/li&gt;
                                  &lt;li id="404"&gt;
                                      @Html.ActionLink("404", "FourOhFour", "Other")
                                  &lt;/li&gt;
  
                              &lt;/ul&gt;
                          &lt;/li&gt;
  
  
                      &lt;/ul&gt;
                  &lt;/div&gt;
  
              &lt;/div&gt;
          &lt;/div&gt;
              &lt;/div&gt;
  
  
      &lt;/nav&gt;
  </code></pre>