Css Firefox浮动错误？我如何得到我的浮动：在同一条线上？

我有以下几把小提琴：

在Chrome中，渲染效果很好。人字形在右边

然而，在Firefox中，它将V形符号向下一行

我搜索过谷歌，找到了一些关于这个bug的帖子，但没有一条建议有用

有没有CSS专家能告诉我我做错了什么

Html:

选中选项

更改浮点的顺序，将其置于文本之前，如下所示：

<div class="btn-group">
  <button data-toggle="dropdown" class="btn btn-default dropdown-toggle"style="width: 400px;text-align: left;">        
    <span class="glyphicon glyphicon-chevron-down" style='float: right;'></span>
    Checked option
  </button>
</div>

选中选项

---

这里还有一个解决方案：

像这样为您的span标记指定样式

position:absolute;
right: 5px;
top : 9px

---

属性

空白

似乎是问题的原因。对于类

btn

此属性为：

空白：nowrap

如果更改该属性，则可以正常工作：

.btn {
    white-space:normal
}

---

选中

如果不希望颠倒元素的顺序，可以

float:left第一个元素。
移除跨度上的浮动，向其添加
位置：绝对
，并使用上/右/下/左对其进行定位。

注意：.btn组已从引导中具有
位置：relative

HTML

这是一张工作票
 这解决了问题。谢谢所有其他的答案。这很有效，但为什么这能解决问题呢？FF中导致浮动的错误是什么：这样做是正确的吗？这不仅仅是FF相关的问题。这就是浮子的工作原理。如果浮动是第二个，它必须在已经有高度的前一个元素之后启动，因此它启动得较低…可能是因为不同的渲染引擎。非常感谢，你用这个简单的解决方法节省了我的时间。非常感谢！尽管我没有使用相同的类，但这非常有用。我正在使用的那些有这样的空白：尽管设置了nowrap！很乐意帮助您找到@Shaaradalviclanest解决方案，但如果我们想要
nowrap
，该怎么办？我认为这应该是公认的答案，另一个答案可能会导致可访问性问题。我更喜欢这个答案：）我不知道为什么这不是一个答案，我总是用左键，这导致了很多问题，但用右键搭配abcelute位置确实比x-man有帮助。
.btn {
    white-space:normal
}

<div class="btn-group">
  <button data-toggle="dropdown" class="btn btn-default dropdown-toggle" style="width: 400px;text-align: left;">        
    <span class="glyphicon glyphicon-chevron-down"></span>
    Checked option
  </button>
</div>

div.btn-group span {
  position: absolute;
  top: 7px;
  right: 12px;
}