html - Bootstrap 4 の li タグがブロック要素として整列しない

Question

http://htmlhelp.com/reference/html40/block.html によると、タグliを使用するliと、Bootstrap 4 の小さなデバイスのトグルでメニューが水平のままになります。liタグがブロック要素である場合、結果は以下のコードは水平メニューではなく垂直メニューにする必要がありますか?

<ul class="nav navbar-nav">
    <li class="nav-item active">
        <a class="nav-link" href="#">Home</a>
    </li>

    <li class="nav-item dropdown">
        <a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">Dropdown</a>
        <div class="dropdown-menu">
            <a class="dropdown-item" href="#">Action</a>
            <a class="dropdown-item" href="#">Another action</a>
            <a class="dropdown-item" href="#">Something else here</a>
            <div class="dropdown-divider"></div>
            <a class="dropdown-item" href="#">Separated link</a>
        </div>
    </li> 
    <li class="nav-item active">
        <a class="nav-link" href="#">Another Menu</a>
    </li>
<ul>