Question

我们试图实现的视觉目标是一个水平菜单，其中一些链接可能跨越多行，但所有链接应垂直居中。

在兼容的浏览器中，这可以通过CSS使用display：table来实现。样本标记：

<ul>
    <li><a href="#">Link</a></li>
    <li><a href="#">Link<br />spanning lines</a></li>
    <li><a href="#">Link</a></li>
</ul>

CSS：

ul {
    display: table
}

ul li {
    display:table-cell;
    vertical-align:middle;
}

ul li a {
    display: block;
}

这很有效。大多数时候。发生的事情是，对于某些人来说，在Windows或OSX上使用某些版本的firefox 3.x，有时在初始页面加载时，LI将会低于其他版本。

页面重新加载可以在99％的时间内解决问题。

这个bug难以重现。它似乎是随机的，充其量。我无法在我的XP机器上实现它，但可以在我的OSX机器上暂时弹出它。

视觉示例：

我们想要什么：

link 1      link 2      link 3      link 4

我们有时会得到什么：

link 1      link 2      link 3
link 4

我找不到太多关于这个问题的参考，虽然我在这里提到了这个可能与之相关的提及：

有没有人遇到这个和/或知道可能是什么造成的？

Answer 1

如果用户使用的是Firefox 3.5或更早版本，那么如果HTTP数据包中断恰好位于表格中间，则可能会遇到https://bugzilla.mozilla.org/show_bug.cgi?id=148810。

您可以通过将表格上的显示切换为onload处理程序中的“none”，清除布局（例如通过执行document.body.offsetWidth）然后将显示设置回“”或“表格”来解决此问题。 ....它不漂亮，但它会起作用。

当然，您可以采取任何措施让您的用户从古老的Firefox版本升级，这对他们和您都有好处。 ;）