【CSS】Bootstapでナビゲーションを2段にしてレイアウトを調整する。

Question

Bootstrap初心者で勉強中で、CSSの問題かもしれませんが調べてもわからなかったので
ご質問させてください。

●Bootstrap Currently v4.5.0
●OS / Mac , エディター / Atom
※ほかに情報が必要でしたら教えてください。

結論：このようにナビゲーションを組みたいです。

ナビゲーションのリンクが奇数の場合、上記のようになり
結果的に空の要素（入れるべきなのか？）を入れてレイアウトを調整したいです。

      <nav>
          <ul class="navbar">
            <li class="nav-item active"><a href="URL">menu01</a></li>
              <li class="nav-item active"><a href="URL">menu02</a></li>
          　      <li class="nav-item active"><a href="URL">menu03</a></li>
          　    <li class="nav-item active"><a href="URL">menu04</a></li>
         　   <li class="nav-item active"><a href="URL">menu04</a></li>
          </ul>
      </nav>

Bootstrapで調整ってできるのでしょうか？
どのような機能を使えば綺麗に記述できるのか勉強させてください(_ _)

Answer 1

単純にリストが並んでいるだけなので、折り返しされて２段になっているのですね。
中央に寄ってしまうのはnavbarクラスに対してデフォルトで
justify-content:space-between が付いているので、
これをjustify-content-startにしてやれば左に寄ります。

Comments

[famous]

ありがとうございます！
justify-contentのことすっかり抜けておりました。。。
ご丁寧にお答えくださってありがとうございます。