创建多行导航栏

Question

我需要创建一个多行导航栏，以使所有内容都可折叠。我在这里看到的示例创建了多个不同的导航栏。这不是我的意图。我需要一个导航栏以下是一个示例。我在单个导航栏中有两个id为firstNav和secondNav的navbar-nav。我需要secondNav出现在自己的行上。

<div class="container-fluid">
<nav class="navbar navbar-light navbar-expand-md">
    <div class="container-fluid"><a href="#" class="navbar-brand">Brand</a>
      <button data-toggle="collapse" data-target="#navcol-1" class="navbar-toggler">
        <span class="sr-only">Toggle navigation</span>
        <span class="navbar-toggler-icon"></span>
      </button>
        <div class="collapse navbar-collapse"
            id="navcol-1">
            <ul class="nav navbar-nav" id="firstNav">
                <li role="presentation" class="nav-item">
                  <a href="#" class="nav-link active">First Item</a>
                </li>
                <li role="presentation" class="nav-item">
                  <a href="#" class="nav-link">Second Item</a>
                </li>
            </ul>

            <ul class="nav navbar-nav" id="secondNav">
                <li role="presentation" class="nav-item">
                  <a href="#" class="nav-link active">Third Item</a>
                </li>
                <li role="presentation" class="nav-item">
                  <a href="#" class="nav-link">Fourth Item</a>
                </li>                    
            </ul>

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