Why doesn't the menu close in boostrap?

Question

Bootstrap

I'm still green on this chew please.
The question is I have a horizontal menu - navBar
Here is the 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>

What am I doing wrong?
Those. the situation is this, when viewed from the mob. hamburger opens but does not close.
And the "Brand" for some reason becomes crooked, pulled up to the top ..
I tried everything, the sources peeled off, the code was rewritten 10 times. I don't understand where I made a mistake.

Here is the 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;
}

Answer 1

I understand that I do not collapse the menu after scrolling to the anchor? In the 3rd bootstrap, it didn’t fold, maybe in the 4th one too. It is necessary to add a small script, I found it in Google on stackoverflow at one time
How to make the menu in bootstrap in the mobile version close when you click on an item from the menu?

Answer 2

Using your code everything works.
maybe someone (we will not name names) cannot hit the button)

Answer 3

Google Chrome: bootstrap 4.4.1 - on button click everything opens and closes. Describe the problem in more detail