Html 某些浏览器中不需要的换行-为什么呈现方式不同？

我正在开发的网站的菜单有问题。以下是不同浏览器中的菜单

Chrome 5

Opera 10

Firefox 4 Beta 2

Internet Explorer 8

在Chrome中，菜单看起来不错，但在某些浏览器中，小箭头被包装到下一行。此外，在Firefox和IE中，菜单项与箭头重叠。我该如何解决这个问题

您可以在这里找到样式表、HTML源代码和所有这些内容：

---

这是因为浮动：在菜单项后面的范围内，带有双箭头（sf类子指示器）。浮动它将允许内容以现在的方式重叠，因为它将元素移出流

---

您可以在这里找到浮动元素背后的理论：

hmmm如果您将小箭头“>>”的范围更改为此，会怎么样

你可以在li的右边添加更多的填充

ul#menu > li > ul li {
...
padding-right:20px;
...
}

---

它在FF中有效，但我不确定其他文件样式中的是否有效。css在

ul#menu>li>ul li
中添加
width:100%
。。。您是否尝试过减小字体大小？如果您使用表格呈现下拉列表，则TD标记具有NOWRAP属性。还有NOBR标签。但我不确定这些字体是否足够标准以供您使用。将字体变小不会有帮助，因为我所有菜单的宽度都是经过计算的，因此最宽的菜单项总是适合您。我使用的是
s，而不是
s。我认为您应该跳过使用
>>
字符作为菜单指示器，而是使用背景图像。在右侧给锚更多的填充以适应图像，我们可以完全避免这个问题。好建议，易。我想我会在几天内实现这一点。
ul#menu > li > ul li {
...
padding-right:20px;
...
}