Как сохранить статичность Навбар-Бренда на верхнем уровне, пока исправлено Навбар-Свернуть

Question

Используя Bootstrap (v4), я бы хотел, чтобы изображение / логотип оставались статичными при перемещении части свертывания (ссылки меню).Другими словами, когда пользователь прокручивает вниз, логотип остается в верхней части страницы, в то время как ссылки меню продолжают опускаться.

Как этого достичь?У меня есть следующие настройки HTML:

<nav class="navbar fixed-top navbar-expand-lg navbar-dark ">

    <div class="container ">
        <a class="navbar-brand" href="index.html" style="margin-bottom: auto;">
        <img src="img/logo.svg"  height="80" alt="Logo">
    </a>

        <!-- icon on phone right -->
        <button class="navbar-toggler blue" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
        <ion-icon name="menu"></ion-icon>
    </button>

        <!-- links -->
        <div class="collapse navbar-collapse white animated fadeInDown" id="navbarSupportedContent">

            <p>
                <a href="index.html">Home</a>
            </p>
            <p>
                <a href="about.html#about">About Us</a>
            </p>

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