Twitter bootstrap 折叠引导3导航栏的位置内容

我试图创建一个部分折叠的导航栏。在导航栏上的元素对齐中，图标位于错误位置。我希望图标在右边，就在折叠按钮的前面，如下图所示

我尝试了很多不同的组合，但一直无法正确定位

如何将图标移动到导航栏的另一侧

下面是我的代码和不需要的输出，图标在左边

切换导航

---

只需在包含图标的按钮上添加类

向右拉即可

<a class="btn navbar-btn navbar-right btn-social-icon btn-xs btn-twitter pull-right">
    <i class="fa fa-twitter"></i>
</a>


请输入正确的代码。您发布的HTML不适用于第一张图片。第一张图片是所需的结果。它是经过编辑的。第二张图片是所提供代码的结果。
<a class="btn navbar-btn navbar-right btn-social-icon btn-xs btn-twitter pull-right">
    <i class="fa fa-twitter"></i>
</a>