如何使用引導程序同時 position 我的漢堡菜單及其在右側的下拉菜單？

Question

我的鏈接在右邊，左邊沒有導航欄。

當屏幕變小時，我希望漢堡包替換這些鏈接而不移動到左側。

我添加了<a href="#"></a>作為徽標占位符，它將漢堡菜單推到右側，但菜單仍然向左打開。

這是代碼：

<nav class="navbar navbar-expand-lg navbar-light bg-light" style="margin-bottom: 20px;">
        <a href="#"></a>
        <button class="navbar-toggler left:auto" data-toggle="collapse" data-target="#navbarMenu">
                <span class="navbar-toggler-icon ml-auto"></span>
        </button>
        <div class="collapse navbar-collapse ml-auto" id="navbarMenu">
                <ul class="navbar-nav ml-auto">
                        <li class="nav-item"><a href="#" class="nav-link">Home</a></li>
                        <li class="nav-item"><a href="#" class="nav-link">FAQ</a></li>
                        <li class="nav-item"><a href="#" class="nav-link">Contact Us</a></li>
                </ul>
        </div>
</nav>

Answer 1

我想這就是你要的，或者我不明白你的問題

<nav class="navbar navbar-expand-lg navbar-light bg-light" style="margin-bottom: 20px;">
    <a href="#"></a>
    <button class="navbar-toggler left:auto" data-toggle="collapse" data-target="#navbarMenu">
            <span class="navbar-toggler-icon ml-auto"></span>
    </button>
    <div class="collapse navbar-collapse ml-auto" id="navbarMenu">
            <ul class="navbar-nav ml-auto">
                    <li class="nav-item ml-auto"><a href="#" class="nav-link">Home</a></li>
                    <li class="nav-item ml-auto"><a href="#" class="nav-link">FAQ</a></li>
                    <li class="nav-item ml-auto"><a href="#" class="nav-link">Contact Us</a></li>
            </ul>
    </div>
</nav>