Firefox问题计算宽度w/CSS内联块&；绝对定位？（推特引导下拉菜单）

我使用的是HTML/CSS框架，特别是。我正在尝试添加一个“键盘快捷键”，它将在每个菜单项中可见并右对齐。菜单的宽度应该调整以适应它的内容——项目名称（左对齐）和键盘快捷键（右对齐），中间有一些填充

除了Firefox在计算菜单宽度时不包括键盘快捷键宽度的情况下渲染菜单外，我的工作正常！（在webkit/特别是Chrome中可以正常工作。）下面是一个屏幕截图，演示了在Firefox中，键盘快捷键元素如何滑到主菜单文本后面：

我把它归结为一个相对简单的页面来演示这个问题——参见

如果我确保菜单的父项没有div是“position:absolute；”，那么我可以使Firefox正确呈现。请参阅我在CSS中标记为注释掉的两行。然而，我不明白为什么我不能对包含的块使用绝对定位，以及为什么这会导致浏览器之间的任何差异

---

关于如何在不删除包含块的绝对位置的情况下解决此问题，有什么线索吗？谢谢。

首先，将

位置：绝对

和

浮动

放在同一个元素上没有好处，因为它们是相互排斥的定位形式（

绝对

覆盖

浮动

）。您可以根据需要取消其中一个。确定哪一个对你需要做的事情更重要

其次，如果嵌套了两个

absolute

div，则需要给它一些宽度，以帮助它知道里面有什么东西。当我把

宽度：100%

放在

.topbar

和

.nav

上时，菜单就成形了。但我不知道宽度是否适合你的情况

您可以绝对地定位

.topbar

，而无需

宽度

，并消除两个子元素上的

绝对

，它似乎也能工作

---

我无法给出更多的解决方案，因为我不知道您希望它如何运行和定位。

它只在WebKit浏览器中工作-在Firefox、IE8/9、Opera中都不工作。是否尝试在快捷方式a中添加宽度值？