css - Dropdown has no content (bootstrap framework) -
hi have following code dropdown using bootstrap-sass
gem:
<div class="nav-collapse collapse" style="height:0px;"> <nav> <ul class= "nav pull-right"> <% if signed_in? %> <li><%= link_to "profile", current_user %></li> <li><%= link_to "users", users_path %></li> <li id = "fat-menu" class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown"> account <b class="caret"></b> </a> <ul class="dropdown-menu"> <li><%= link_to "settings", edit_user_path(current_user) %></li> <li class="divider"></li> <li> <%= link_to "sign out", signout_path, method: "delete" %> </li> </ul> </li> <% else %> <li><%= link_to "sign in", signin_path %></li> <%end%> </ul> </nav> </div>
however when click on account
shows following , not contents:
you can see little white triangle shows it's been clicked on no contents. when i'm debugging can see menu in chrome here:
instead of:
<a href="#" class="dropdown-toggle" data-toggle="dropdown"> account <b class="caret"></b> </a>
you should use:
<a href="#fat-menu" class="dropdown-toggle" data-toggle="dropdown"> account <b class="caret"></b> </a>
also, please provide javascript file enables menu (it isn't including js files, must enable dropdown somewhere). this:
$(".dropdown-toggle").dropdown();
Comments
Post a Comment