Html Bootstrap 4导航栏下拉列表更改其他导航项位置时出现问题

我的网站导航栏有问题。当我将导航栏展开时，它可以正常工作，但当它处于折叠状态（对于移动设备）时，导航栏中的下拉项会向左推动其他元素，并忽略使下拉菜单向右对齐的代码（下拉菜单右）

我不知道它为什么这样做。如果有人能找到解决办法，我们将不胜感激

如果没有解决办法，我也希望听到其他选择

语言

设置

下拉菜单的样式

.dropdown-menu{ position:absolute !important;}

（与
！important
不同，我建议将样式直接应用于
div
，以优先于Bootstrap的默认css）
这对我很有效

#dropdown-menu-align-right.dropdown-toggle::after{
  margin:0px !important;  
  vertical-align: initial !important;  
}

.dropdown-toggle[aria-expanded="true"]:after{
  position:initial !important;
  display:inline !important;
  padding-right: 0px !important;  
  padding-bottom: 0px !important;
  padding-top: 0px !important;
  width: 0px !important;
  min-width: 0rem !important;
  padding-left: 4px !important;
  margin:0ox !important;
  
}

.dropdown-toggle[aria-expanded="false"]:before{
  padding-left: 4px !important;
  padding-right: 0px !important;
  padding-bottom: 0px !important;
  padding-top: 0px !important;
  position: initial !important;
  display: inline !important;  
  width: 0px !important;
  min-width: 0rem !important;  
}

弹性行是这样做的，这样我可以水平显示导航项目，而不是垂直显示正常项目。我不希望任何项目是正确对齐的。我希望下拉列表以右对齐方式显示其列出的项目，因为当前它以左对齐方式显示，并且在mobile view.Erm中显示时被剪裁到显示区域。。你运行我的示例了吗？它保持水平视图而不是垂直视图，并使列表垂直而不是在移动视图中被剪裁。我确实运行了您的示例，并且在折叠的移动视图中，导航项目显示为垂直而不是水平（在向下的列表中，而不是并排显示）。这就是我想通过添加Flex-Row来改变的。啊，我搞错了。我以为你指的是导航栏本身而不是里面的那个。我会想出一个解决办法soon@GerhardPlesch我已经更新了答案。希望这就是你想要的^^