Для больших экранов меню гамбургеров прекрасно работает (изменена точка останова до 1200). На телефонах меню прекрасно работает.Меню Bootstrap Hamburger не отображает ССЫЛКИ, когда на iPad mini
На iPads меню гамбургеров отображается нормально, но когда вы нажимаете на него, параметры не отображаются! Пожалуйста помоги!!! Спасибо.
Вот HTML
<div class="navbar navbar-default navbar-fixed-top navbar-fixed-top-real" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<%= link_to situations_path do %>
<%= image_tag('A-Lister_Logo.png', class: "navbar-brand", height: '60', :alt => "A-Lister Logo") %>
<% end %>
</div>
<div class="collapse navbar-collapse">
<ul class="nav navbar-nav navbar-right">
<li class="hidden-sm">
<%= link_to 'Hot Situations', situations_path %>
</li>
<li class="hidden-sm">
<%= link_to 'New Situations', newest_situations_path %>
</li>
<li class="hidden-sm">
<%= link_to 'A-Listers', alisters_path %>
</li>
<li class="hidden-sm">
<%= link_to 'Add Situation', new_situation_path %>
</li>
<% if !(user_signed_in?) %>
<li class="hidden-sm">
<%= link_to('Become an A-Lister', new_user_registration_path) %>
</li>
<li class="hidden-sm">
<%= link_to('Login', new_lister_session_path) %>
</li>
<% else %>
<li class="hidden-sm">
<%= link_to(("My Situations"), my_situations_path) %>
</li>
<li class="hidden-sm">
<%= link_to(("Edit Account"), edit_user_registration_path) %>
</li>
<li class="hidden-sm">
<%= link_to('Logout', destroy_user_session_path, :method => :delete) %>
</li>
<% end %>
</ul>
</div><!--/.nav-collapse -->
</div>
</div> <!--/.navigation -->
Вот CSS.SCSS
body {
font-family: 'Merriweather', serif;
color: black;
padding-top: 70px;
}
@media (max-width: 1200px) {
.navbar-header {
float: none;
}
.navbar-left,.navbar-right {
float: none !important;
}
.navbar-toggle {
display: block;
}
.navbar-collapse {
background: white;
}
.navbar-fixed-top {
top: 0;
border-width: 0 0 1px;
}
.navbar-collapse.collapse {
display: none!important;
}
.navbar-nav {
float: none!important;
margin-top: 7.5px;
}
.navbar-nav>li {
float: none;
}
.navbar-nav>li>a {
padding-top: 10px;
padding-bottom: 10px;
line-height:0;
}
.collapse.in{
display:block !important;
}
}
.navbar-fixed-top-real {
font-size:100%;
background: white;
border-bottom: 3px solid rgb(222,0,32);
max-height: 70px;
z-index:2;
}
.navbar-nav li a {
padding-top: 45px;
z-index:2;
font-size: 118%;
}
Спасибо за вашу помощь!