Question

HTML：

<td align="center" width="100%">
<a class="Forum_ib_moderate" href="Default.aspx" title="Moderate"></a>
<a class="Forum_ib_admin" href="Default.aspx" title="Admin"></a>
...

CSS：

A.Forum_ib_moderate:link, A.Forum_ib_moderate:visited, A.Forum_ib_moderate:active, A.Forum_ib_moderate:hover
{
background-image: url(images/ib_moderate.png);
background-repeat: no-repeat;
background-position: center;
padding-left: 2px;
padding-right: 2px;
padding-top: 8px;
padding-bottom: 0px;
height: 35px;
width: 35px;
display:table-cell;
}

A.Forum_ib_admin:hover
{
background-image: url(images/ib_admin_hover.png);

}

菜单在IE中看起来很好，在Firefox中显示垂直。如果我关闭“显示：table-cell;”在Firebug中的样式，然后重新打开它，它修复了该菜单节点。

任何想法？

p.s。：我不想弄乱菜单本身，因为它是DNN论坛4.4.3的一部分。我宁愿修复CSS以使其正确显示。

Answer 1

实际上我认为你会发现IE有效，因为它忽略 display: table-cell。 Display: table-cell实际上是你的问题。

我猜测正在发生的是，IE正在将那些内容恢复为内联元素，因此是水平的。

将其更改为：

display: inline;

根据需要添加一些填充（左和右），你就会得到你想要的东西。

或者你可以漂浮它们（左和/或右）。

Besdies，他们已经在桌子上了。内部的表格单元显示有点不对。

Answer 2

我们也遇到过这个问题。仍在寻找解决方案。在我们的例子中，我们需要保持显示：table-cell layout。

Firefox有时似乎是随机的，会导致表格单元格对象换行，而不是像实际表格那样行事。 REFRESH修复了它，这使得修复bug变得更加困难。

Answer 3

似乎是一个简单的FireFox错误。我反过来遇到了这个问题：在Win XP上的FF 3.5.9中刷新后，表格单元格下方的DIV排列在彼此之下。

我无法找到任何解决方案（将单元格包装成行，隐藏溢出等），但要将FireFox更新为3.6.3并希望用户很少使用该版本。

Answer 4

这听起来类似于我试图修复的firefox reflow bug。显然，表格对于渲染非常糟糕，因为它们会导致重排，似乎Firefox有时会错过重排。

我发现以下页面很有帮助：

在Firefox中打破CSS菜单（显示：table-cell;）

4 个答案: