Firefox中的浮动右对齐问题

【问题标题】：float right alignment issue in FirefoxFirefox中的浮动右对齐问题
【发布时间】：2014-04-30 12:52:35
【问题描述】：

检查此Fiddle。注意箭头图标，它位于第一行（在 Chrome 和 IE 中）。当我在 Firefox 中打开它时，它的对齐方式会改变。为什么会发生？解决办法是什么？

.arrow{
   float:right;
}

PS：Imran 和Kheema 建议的解决方案不是我想要的。我不想更改 HTML 结构，那样的话我必须在很多地方进行更改。

【问题讨论】：

你想添加那个箭头的位置是什么？
我想要与 Chrome 相同的行为，箭头在第一行。 <a href="doc4.html" name="doc4" target="_blank">doc4</a><span class="arrow arrow_up"></span><div style="" class="toggle"><div>
@ChankeyPathak 我已经更新了我的答案，请看一下。

【解决方案1】：

请看这个演示。箭头在 Firefox 中的位置与在 Google 中的位置相同。

所以我在这里做什么。我换行，即将span标签放在a标签之前。

<span class="arrow arrow_up"></span>
<a href="doc4.html" name="doc4" target="_blank">doc4</a>
<div style="" class="toggle"><div>

另一个解决方案是从th 和td 中删除white-space: nowrap;

th, td {
    /*white-space: nowrap;*/
}

查看更新后的Demo。

【讨论】：