导航栏中的Bootstrap（4.0）下拉菜单不能与视口相关
我有一个导航栏和一个链接BTN漂浮在导航栏中的权利。 链接btn触发下拉菜单。 我希望打开的下拉列表固定在视口的右侧。 当下拉菜单打开时，它目前只有一半隐藏在视口右侧。 即使将下拉菜单右侧的类添加到下拉菜单div中。
<div class="collapse navbar-collapse">
<ul class="navbar-nav mr-auto">
<li class="nav-item">
<a class="btn btn-primary align-middle" href="/Home">Home</a>
</li>
<li class="nav-item">
<a class="btn btn-default align-middle" href="#link1">link1</a>
</li>
<li class="nav-item">
<a class="btn btn-default align-middle" href="#link2">link2</a>
</li>
<li class="nav-item">
<a class="btn btn-default align-middle" href="#link3">link3</a>
</li>
</ul>
<div class="form-inline my-2 my-lg-0">
<button class="btn btn-outline-success my-2 my-sm-0" type="submit">Try it free</button>
<span> or </span>
<div class="dropdown">
<a class="text-primary btn-link btn" href="#" id="loginMenu" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><span class="fa fa-shield" aria-hidden="true"></span> Login</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="loginMenu">
<form class="px-4 py-3">
<div class="form-group">
<label for="exampleDropdownFormEmail1">Email address</label>
<input type="email" class="form-control" id="exampleDropdownFormEmail1" placeholder="email@example.com">
</div>
<div class="form-group">
<label for="exampleDropdownFormPassword1">Password</label>
<input type="password" class="form-control" id="exampleDropdownFormPassword1" placeholder="Password">
</div>
<div class="form-check">
<label class="form-check-label">
<input type="checkbox" class="form-check-input">
Remember me
</label>
</div>
<button type="submit" class="btn btn-primary">Sign in</button>
</form>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#">New around here? Sign up</a>
<a class="dropdown-item" href="#">Forgot password?</a>
</div>
</div>
</div>
</div>
如果可能，我希望能够使用引导类来达到预期的效果。 可能我需要添加一些自定义样式，因为菜单是可折叠的，将下拉触发链接按钮向左推。 在这种情况下，我希望下拉菜单仍然位于视口的右侧。 有兴趣了解为什么下拉菜单权利根本不起作用？ 谢谢！
下拉菜单应该在导航栏中有.navbar-nav，才能正确工作，因为它写在这里：https：//getbootstrap.com/docs/4.0/components/navbar/#supported-content
链接地址: http://www.djcxy.com/p/94565.html上一篇: Bootstrap (4.0) dropdown in navbar cannot position right in relation to viewport