bootstrapのナビゲーションでロゴも一緒に表示したい

実現したいこと

ロゴ画像とナビゲーションを一緒に表示したい

前提

bootstrapとhtmlで画面上部のロゴとナビゲーションを作成しているのですが、ロゴが表示されません。画像のurlはブラウザで開けるので画像urlは間違えてないと思います。

発生している問題・エラーメッセージ

開発者ツールのconsoleメッセージではlogo.svg:1 Third-party cookie will be blocked in future Chrome versions as part of Privacy Sandbox.Understand this warningと出てきますが、navbarから外すとロゴは表示されます

該当のソースコード

css
1ソースコード

    <div class="collapse navbar-collapse justify-content-end" id="bs-navi">
        <ul class="navbar-nav">
            <li class="nav-item"><a class="nav-link" href="#">ホーム</a></li>
            <li class="nav-item"><a class="nav-link" href="#">GAOカード</a></li>
            <li class="nav-item"><a class="nav-link" href="#">奨学財団</a></li>
            <li class="nav-item"><a class="nav-link" href="#">会長挨拶</a></li>
            <li class="nav-item"><a class="nav-link" href="#">組織のご案内</a></li>
            <li class="nav-item"><a class="nav-link" href="#">名簿</a></li>
            <li class="nav-item"><a class="nav-link" href="#">地図で検索</a></li>
            <li class="nav-item"><a class="nav-link" href="#">同窓会開催情報</a></li>
            <li class="nav-item"><a class="nav-link" href="#">会報誌</a></li>
            <li class="nav-item"><a class="nav-link" href="#">リンク集</a></li>
            <li class="nav-item"><a class="nav-link" href="#">筑高タウンページ</a></li>
        </ul>
    </div>
</nav>
<div style="text-align: center; margin-top: 50px;">
    <img src="https://chikushigaoka-dousoukai.com/images/logo.svg" alt="福岡県立筑紫丘高等学校同窓会【公式】" style="max-height: 50px;">
</div>