javascript - 如何右对齐/对齐 Bootstrap 下拉菜单项？

Question

我正在尝试将标准 Bootstrap 下拉菜单中的元素与菜单中的右侧对齐。通常它们是左对齐的。

我需要这个，因为我要显示从右到左 (RTL) 阅读的语言。

我尝试的任何东西似乎都无法正常工作，在任何元素上使用“pull-right”类，例如<li> , <a>或 <span>将鼠标悬停在某个元素上时全部失败 - 例如突出显示的大小或形状错误。

请注意 dropdown-menu-right <ul> 中的类只将整个菜单容器与父按钮对齐，而不是将菜单中的元素与容器对齐(这是我想要的)。当前代码是:

   <ul class="dropdown-menu dropdown-menu-right">
      <li><a href="#"><span dir="rtl">جديد ...</span></a></li>
      <li><a href="#"><span dir="rtl">حفظ ...</span></a></li>
      <li><a href="#"><span dir="rtl">تحميل ...</span></a></li>
      <li><a href="#"><span dir="rtl">نص عادي (العادية) المشاركة ...</span></a></li>
      <li class="divider"></li>
      <li><a href="#" id="quitapp"><span dir="rtl"><i class="fa fa-close fa-lg fa-fw"></i>&nbsp;الإقلاع عن التدخين ...
    </span></a></li>
    </ul>

(注意:我需要 <span dir="rtl"> 来确保文本以正确的方向显示，并希望保持菜单的整体外观(所以不确定是否转换为 <divs> 或 <listgroups> )

非常感谢任何建议/解决方案!我正在使用 Bootstrap 3.3.5

非常感谢

Answer 1

您可以对 a 标签使用 style = "text-align : right;"。它应该有效。