прекратить фиксировать положение навигационной панели при изменении выравнивания

Question

В настоящее время я создаю панель навигации со следующим кодом начальной загрузки:

<div class="nav-wrap">
    <div class="container">
        <nav class="navbar navbar-expand-lg">
            <div class="collapse navbar-collapse" id="navbarSupportedContent">
                <ul class="navbar-nav mr-auto">
                    <li class="nav-item active">
                        <a id="logo" class="nav-link" href="#">Lattes <span class="sr-only">(current)</span></a>
                    </li>
                </ul>
                <ul class="nav navbar-nav navbar-right">
                    <li><a class="nav-link right-link" href="#">About</a></li>
                    <li><a class="nav-link right-link" href="#">Services</a></li>
                    <li><a class="nav-link right-link" href="#">Portfolio</a></li>
                    <li><a class="nav-link right-link" href="#">Team</a></li>
                    <li><a class="nav-link right-link" href="#">Contact</a></li>

                </ul>
            </div>
        </nav>
    </div>
</div>

Это дает желаемый результат со ссылками справа и заголовком слева как таковой:

Я пытаюсь зафиксировать положение панели навигации в верхней части экрана, чтобы панель навигации всегда находилась вверху окна пользователя с помощью следующего css:

    .navbar {
        background-color: #222222;
        border-radius: 5px; 
        position:fixed;
    }

Это работает для удержания панели в верхней части экрана, однако она нарушает выравнивание, а выравнивание по левому краю выравнивает все элементы в панели:

Есть ли решение зафиксировать панель навигации в позиции без изменения выравнивания?

Answer 1

Возможно, ваш .navbar изначально занимал другую позицию, чем 'fixed'.

Я бы предложил вам добавить position: fixed; к элементу nav-wrap.