Bootstrap：从Navbar中的Caret中分离Anchor标签

Question

我有以下代码：

%a.dropdown-toggle-nav.no-active(data-toggle='dropdown' href='')
        Accounts
        %i.icon-caret-down
      %ul.dropdown-menu(role='menu')
        ...

如下所示：

我想要做的是分离锚和插入功能。当我点击Accounts时，它是一个锚标记，将我带到一个特定页面，当我点击插入符号时，它会切换下拉元素（停留在同一页面上）。

我试图将它们放在两个单独的锚标签中：

      %a.dropdown-toggle-nav.no-active(href=accounts_requests_path)
        Accounts
      %a.dropdown-toggle-nav.no-active(data-toggle='dropdown' href='')
        %i.icon-caret-down
      %ul.dropdown-menu(role='menu')

但是由于bootstrap css，这会将元素放在两条不同的行上，我希望将插入符号保留在文本旁边。我想过使用绝对定位来强制插入符号紧靠文本，但必须有更好的解决方案。

任何想法？