Не свёрнутое меню

onelawyer
onelawyer
847
2
Содержание:
  1. Комментарии
Добрый день, подскажите, где может быть ошибка в коде, при переходе к разрешению меньше 767 пикселей, меню становиться вертикальным с «гамбугером», но пункты меню остаются развёрнутыми?

<nav class="navbar navbar-default " role="navigation"> 

 <div class="navbar-header"> 
 <button type="button" data-target="#navbarCollapse" data-toggle="collapse" class="navbar-toggle" aria-expanded="false"> 
 <span class="sr-only">Toggle navigation</span> 
 <span class="icon-bar"></span> 
 <span class="icon-bar"></span> 
 <span class="icon-bar"></span> 
 </button> 
 <a href="#" class="navbar-brand"></a>
 </div> 


 <div id="navbarCollapse" class="collapse navbar-collapse navbar-right" >
     

  
 
 <ul class="nav navbar-nav"> 
 <li><a href="index.html">Главная</a></li> 
 
 <li><a class="page-scroll" href="#services">Услуги</a></li> 
 <li><a href="price.html">Цены</a></li> 
 <!--<li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Блог сайта <span class="caret"></span></a> 

 <ul class="dropdown-menu"> 
 <li><a href="windows.html">Windows</a></li> 
 <li><a href="#">Программы</a></li> 
 <li><a href="#">Ноутбуки</a></li> 
 <li><a href="#">Вост данных</a></li> 
 <li><a href="#">Для начинающих</a></li> 
 <li><a href="#">Интернет</a></li> 
 <li><a href="#">Безопасность</a></li> 
 <li><a href="#">Ремонт компьютеров</a></li>
 </ul> 
 
 </li> -->
 <li><a class="page-scroll" href="#contact">Контакты</a></li> 
 </ul> 

 </div>

 </nav>

Скрин yadi.sk/i/RRiydN7i3JCY25

Комментарии:

  1. Александр Мальцев
    Александр Мальцев
    17.05.2017, 15:49
    Попробуйте добавить к кнопке «Гамбургер» класс collapsed:
    <button type="button" data-target="#navbarCollapse" data-toggle="collapse" class="navbar-toggle collapsed" aria-expanded="false">
    
    Более корректно класс navbar-right применять к элементам меню, но не к обёрточному контейнеру:
    <div id="navbarCollapse" class="collapse navbar-collapse ">
      <ul class="nav navbar-nav navbar-right">
        ...
      </ul>
    </div>
    
    1. onelawyer
      onelawyer
      17.05.2017, 16:00
      К сожалению не схлопывается, думаю где-то в стилях накасячил
    Войдите, пожалуйста, в аккаунт, чтобы оставить комментарий.