问题
I'm using Twitter Bootstrap. It works very well and the navbar works well. It is responsive and adjusts accordingly, but when you shrink the screen on desktop or when you pull up the site on a mobile phone, it starts off expanded already taking up a bunch of the screen. I want it to start off collapsed with the option to expand.
The code is below:
<div class="navbar navbar-fixed-top">
<div class="navbar-inner">
<div class="container">
<!-- .btn-navbar is used as the toggle for collapsed navbar content -->
<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</a>
<a class="brand" href="/">My Site</a>
<div class="nav-collapse collapse">
<ul class="nav">
<li <% if @league=='recruiting' %>class="active"<% end %>><%= link_to "Recruiting", :controller => "league", :action=>"index", :league=>"recruiting" %></li>
<li <% if @league=='college' %>class="active"<% end %>><%= link_to "College", :controller => "league", :action=>"index", :league=>"college" %></li>
<li <% if @league=='nfl' %>class="active"<% end %>><%= link_to "NFL", :controller => "league", :action=>"index", :league=>"nfl" %></li>
</ul>
<ul class="nav pull-right">
<li><a href="/blog">Blog</a></li>
<li <% if params[:controller]=='chart' %> class="active"<% end %>><a href="/data/all/hundred">Data</a></li>
<% if user_signed_in? %>
<li><%= link_to "My Profile", user_profile_path(:username => current_user.username) %></li><li><%= link_to('Logout', destroy_user_session_path, :method => :delete) %></li>
<% else %>
<li><%= link_to "Login", "#login-lightbox", 'data-toggle'=>"modal", 'id'=>'login-link' %></li>
<% end %>
</ul>
</div>
</div>
</div>
</div>
来源：https://stackoverflow.com/questions/11405765/twitter-bootstrap-navbar-auto-expands-on-mobile-tablet