title: My navbar is displaying too many items and overflows. How can I collapse it at a higher screen width?
body: <p>Below is my code. I tried setting max-height to its normal height, and I've searched a lot but found nothing that has worked. It is in an ASP.NET master page if that makes a difference.</p>
  
  <pre><code>div class="navbar navbar-inverse navbar-fixed-top"&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;
                  &lt;a class="navbar-brand" runat="server" href="~/Pages/TeamProfile"&gt;ManageU&lt;/a&gt;
              &lt;/div&gt;
              &lt;div class="navbar-collapse collapse"&gt;
                  &lt;ul class="nav navbar-nav"&gt;
                      &lt;li&gt;&lt;a runat="server" href="~/Pages/TeamProfile"&gt;Team Profile&lt;/a&gt;&lt;/li&gt;
                      &lt;li&gt;&lt;a runat="server" href="~/Pages/PlayerSchedule"&gt;My Schedule&lt;/a&gt;&lt;/li&gt;
                      &lt;li&gt;&lt;a runat="server" href="~/Pages/Roster"&gt;Roster&lt;/a&gt;&lt;/li&gt;
                      &lt;li&gt;&lt;a runat="server" href="~/Pages/TestCal"&gt;Calendar&lt;/a&gt;&lt;/li&gt;
                      &lt;li&gt;&lt;a runat="server" href="~/Pages/Tasks"&gt;Tasks&lt;/a&gt;&lt;/li&gt;
                      &lt;li&gt;&lt;a runat="server" href="~/Pages/FindTime"&gt;Meetings&lt;/a&gt;&lt;/li&gt;
                      &lt;li&gt;&lt;a runat="server" href="~/Pages/Contact"&gt;Contact&lt;/a&gt;&lt;/li&gt;
                      &lt;li&gt;&lt;a runat="server" href="~/Pages/InvitePlayers"&gt;Invite&lt;/a&gt;&lt;/li&gt;
                      &lt;li&gt;&lt;a runat="server" href="~/Pages/MyInfo"&gt;My Info&lt;/a&gt;&lt;/li&gt;
                      &lt;li&gt;&lt;a runat="server" href="~/Pages/ChangePassword"&gt;Change Password&lt;/a&gt;&lt;/li&gt;
                  &lt;/ul&gt;
                  &lt;asp:LoginView runat="server" ViewStateMode="Disabled"&gt;
                      &lt;AnonymousTemplate&gt;
                          &lt;ul class="nav navbar-nav navbar-right"&gt;
                              &lt;li&gt;&lt;a runat="server" href="~/Pages/Landing" onclick="logOut_Click"&gt;Log Out&lt;/a&gt;&lt;/li&gt;
                          &lt;/ul&gt;
                      &lt;/AnonymousTemplate&gt;
                  &lt;/asp:LoginView&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  </code></pre>