Почему эти элементы navbar не находятся в одном ряду с начальной загрузкой navbar?

Question

В моем проекте я использую бутстрап.И я использую navbar с ГЛАВНОЙ СТРАНИЦЕЙ, МОИМИ ТОВАРАМИ, ПОКУПКОЙ АВТОМОБИЛЯ и логином.

Я хочу, чтобы они были в одной горизонтальной линии, но на самом деле они в разных строках.

Разрешение моегомонитор 1680х1050

 <div class="navbar">
    <div class="navbar-inner">
        <a class="brand" href="" target="_self">MAIN PAGE</a>
        <ul class="nav">
            <li class="active"> <a href="trade.php" target="_self">My GOODS</a></li>
            <li class="active"> <a href="cart.php" target="_self">SHOPPING CAR</a></li>
        </ul>
        <ul class="nav pull-right">
            <li class="active">
            <a href="login.php?action=login">login</a>
            </li>
        </ul>
    </div>
</div>

Кто мне может помочь?

Answer 1

Вы, вероятно, должны просмотреть документацию , чтобы увидеть, как это правильно сделано.

независимо от того, используя ваш код, добавьте navbar-expand-sm в контейнер и navbar-nav во внутренний div.

<div class="navbar navbar-expand-sm">
    <div class="navbar-inner navbar-nav">
        <a class="brand" href="" target="_self">MAIN PAGE</a>
        <ul class="nav">
            <li class="active"> <a href="trade.php" target="_self">My GOODS</a></li>
            <li class="active"> <a href="cart.php" target="_self">SHOPPING CAR</a></li>
        </ul>
        <ul class="nav pull-right">
            <li class="active">
            <a href="login.php?action=login">login</a>
            </li>
        </ul>
    </div>
</div>

https://www.bootply.com/xufZyDyeiK