首页 > 解决方案 > 使用引导下拉子菜单

问题描述

我有一个我在这里 wssl.beta.org 制作的引导导航栏。子导航下拉菜单按预期工作,直到您到达页面右侧。我正在尝试使子导航出现在右侧。现在我有这个导航栏:

<li class="nav-item active">
          <a style=" color:#FFBB3F;" class="nav-link dropdown-toggle" href="#" id="navbarDropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
            FIELDS
          </a>
          <ul class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
            <li><a class="dropdown-item" href="#">Action</a></li>
            <li><a class="dropdown-item" href="#">Another action</a></li>
            <li class="dropdown-submenu-left"><a class="dropdown-item dropdown-toggle" href="#">Submenu</a>
              <ul class="dropdown-menu">
                <li><a class="dropdown-item" href="#">Submenu action</a></li>
                <li><a class="dropdown-item" href="#">Another submenu action</a></li>
              </ul>
            </li>
          </ul>
        </li>

但由于某种原因,它一直出现在右侧。我尝试将 -left 附加到下拉菜单,但这也不起作用。

标签: javascripthtmlcssbootstrap-4nav

解决方案


使用<li class="dropdown-submenu pull-left">代替<li class="dropdown-submenu-left">

演示

来自https://stackoverflow.com/a/16485503/10997917


推荐阅读