我有一个导航条和一个链接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>&nbsp; or &nbsp;</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>

如果可能的话，我希望能够使用引导类来实现所需的效果。可能我需要添加一些自定义样式，因为菜单是可折叠的，它将下拉触发链接按钮推向左侧。在这种情况下，我希望下拉列表仍然打开位于视口右侧的位置。有兴趣了解为什么下拉菜单权限根本不起作用？谢谢！