Why doesn't navbar-fixed-top work [Bootstrap 3]?

Question

css

HTML

<!-- Навигация -->
<div id="bootstrap-menu" class="navbar navbar-default navbar-fixed-top" role="navigation">
    <div class="container-fluid">
        <div class="navbar-header"><a class="navbar-brand" href="#">Site</a>
            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-menubuilder"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span>
            </button>
        </div>
        <div class="collapse navbar-collapse navbar-menubuilder">
            <ul class="nav navbar-nav navbar-left">
                <li><a href="#Portfolio">Пункт 1</a>
                </li>
                <li><a href="#Benefits">Пункт 2</a>
                </li>
                <li><a href="#Reviews">Пункт 3</a>
                </li>
                <li><a href="#MakeOrder">Пункт 4</a>
                </li>
                <li><a href="#">Телефон</a>
                </li>
            </ul>
        </div>
    </div>
</div>

css

/* Навигация */
#bootstrap-menu.navbar-default .navbar-brand {
    color: rgba(255, 255, 255, 1);
}
#bootstrap-menu.navbar-default {
    font-size: 24px;
    background-color: rgba(204, 0, 0, 1);
    border-bottom-width: 0px;
}
#bootstrap-menu.navbar-default .navbar-nav>li>a {
    color: rgba(255, 255, 255, 1);
    background-color: rgba(204, 0, 0, 1);
}
#bootstrap-menu.navbar-default .navbar-nav>li>a:hover,
#bootstrap-menu.navbar-default .navbar-nav>li>a:focus {
    color: rgba(204, 0, 0, 1);
    background-color: rgba(255, 255, 255, 1);
}
#bootstrap-menu.navbar-default .navbar-nav>.active>a,
#bootstrap-menu.navbar-default .navbar-nav>.active>a:hover,
#bootstrap-menu.navbar-default .navbar-nav>.active>a:focus {
    color: rgba(204, 0, 0, 1);
    background-color: rgba(255, 255, 255, 1);
}
#bootstrap-menu.navbar-default .navbar-toggle {
    border-color: #ffffff;
}
#bootstrap-menu.navbar-default .navbar-toggle:hover,
#bootstrap-menu.navbar-default .navbar-toggle:focus {
    background-color: #ffffff;
}
#bootstrap-menu.navbar-default .navbar-toggle .icon-bar {
    background-color: #ffffff;
}
#bootstrap-menu.navbar-default .navbar-toggle:hover .icon-bar,
#bootstrap-menu.navbar-default .navbar-toggle:focus .icon-bar {
    background-color: #cc0000;
}

Answer 1

Wangyu
Body padding required
Bootstrap

Answer 2

I know that more than three years have passed on this issue,
I also wanted to do this, I think if navbar-fixed, it should always be there, but no.
I solved it by adding another sticky-top class
See https://bootstrap-4.ru/docs/4.0/components/navbar/
section Placement.