Почему меню не закрывается в boostrap?

Question

[Максим]

Я еще зелёный по этому разжуйте пожалуйста.
Вопрос такой у меня есть горизонтальное меню - navBar
Вот HTML:

<div class="navbar navbar-inverse navbar-fixed-top">
      <div class="container">
        <div class="navbar-header">
        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
          </button>
          <a class="navbrand-brand" href="#">БРЕНД ЛОГО</a>
      </div>
      <div class="navbar-collapse collapse">
        <ul class="nav navbar-nav navbar-right">
          <li class="active"><a href="#">Домой</a></li>
          <li><a href="#it">Ссылка</a></li>
          <li><a href="#headerwrap2">Ссылка</a></li>
          <li><a href="#dg">Ссылка</a></li>
          <li><a href="#red">Ссылка</a></li>
          <li><a href="mailto:МЫЛО"><i class="fa fa-envelope-o" aria-hidden="true"></i></a></li>
          <li><a href="#f"><i class="fa fa-phone" aria-hidden="true"></i></a></li>
          </ul>
      </div>
    </div>
  </div>

Что я делаю не правильно?
Т.е. ситуация такая, при просмотре с моб. гамбургер открывается, но не закрывается.
И "Бренд" почему то криво как то становится, задранный к верху..
Перепробовал всё, облез источники, код переписывался по 10 раз. Не понимаю где допустил ошибку.

Вот CSS.

.navbar {
  font-weight: 800;
  font-size: 14px;
  padding-top: 15px;
  padding-bottom: 10px;
}

.navbar-inverse {
  background: #2d2d2d;
  border-color: #2d2d2d;
}
.navbar-inverse .navbar-nav > .active > a {
  background-color: #3d3d3d;
}
.navbar-inverse .navbar-brand {
  color: #999;
  font-weight: bolder;
  font-size: 22px;
  letter-spacing: 1px;
}

Comments

[Екатерина Ивасенко]

а можно js код? как вы открываете меню?

[Игорь]

Екатерина Ивасенко, Это функционал бутстрапа, он не может вам JS показать.

[Екатерина Ивасенко]

loonny, не правильно прочитала вопрос, понял принял

Answer 1

[Антон Литвиненко]

Я так понимаю, что не сворачивает я меню после прокрутки до якоря? В 3м бутстрапе и не сворачивалось, возможно в 4м тоже. Надо дописать небольшой скрипт, я в гугле на стековерфлоу находил в свое время
Как сделать что бы меню в bootstrap в мобильной версии закрывалось при клике на пункте из меню?

Comments

[Максим]

Да, верно понимаете.
Натыкался уже на эту статью, сейчас еще по внимательнее изучу, отпишусь

[Максим]

По пробовал я

$(function(){ var navMain = $(".navbar-collapse"); navMain.on("click", "a:not([data-toggle])", null, function () { navMain.collapse('hide'); }); });

Вставил в head
Ничего не изменилось

[Антон Литвиненко]

lognog, в сама функция срабатывает? Проверь через консоль лог

Answer 2

[Игорь]

Используя ваш код, все работает.
возможно кое-кто (не будем называть имен) не может попасть по кнопке)

Comments

[Денис Григоров]

Ну что ж вы так =D

[Игорь]

Денис Григоров, чегоо?) Я просто предположил)

[Максим]

Вы говорите про мобильную версию?

Answer 3

[Денис Григоров]

Google Chrome: bootstrap 4.4.1 - при нажатии на кнопку все открывается и закрывается. Опишите более подробнее проблему