使用Firefox中的JQuery UI在选项卡下进行差距

Question

我一直在为我的网站的各个方面使用JQueryUI，并且一个小的选项卡式菜单集运行良好，除了在Firefox中。下图显示了在firefox顶部和IE9下面呈现的相同代码。注意选项卡下的间隙和选项卡内填充（可能？）的增加。我已从网站（第二张图片）中删除了所有样式表，只留下了基本的JQuery UI，但差距仍然存在，只在firefox中出现。

js调用基本可以：

    $("#menuTabs").tabs();

我的IE显示问题并不常见于firefox ...删除了我生成的所有CSS，并确保没有应用任何样式，我不知道下一步要去哪看！ / p>

如果你能提出任何可能导致它的建议，我会很开心！

[编辑] 在尽可能缩小代码并仅使用“已知良好”库之后，事实证明它是由于它位于表格单元格中而引起的！

这里有一些你可以玩的代码！ http://jsfiddle.net/XVHTk/ 但是当检查“Normalized CSS”时它确实有用，所以它可能是从单元格继承的填充吗？

[编辑＃2]

右。

所以

事实证明，应用于表格以移除填充和边距以及边框等的CSS样式是不够的。您必须在表定义中包含cellpadding =“0”和cellspacing =“0”，否则jQuery选项卡会在它们周围添加一些额外的填充。

奇

jsFiddle with table and no extras：http://jsfiddle.net/XVHTk/1/

jsFiddle with table spacing / padding stripped：http://jsfiddle.net/XVHTk/2/

为什么HTML单元格属性被转移到选项卡中，我不知道。我很乐意修好它！

Answer 1

这是由ui-helper-clearfix类中的错误引起的。请参阅ticket #8442和the associated fix。正如您从票证中看到的那样，这在1.10.1中已得到修复。我创建了一个显示此working properly with 1.10.1和using 1.8.x with additional CSS to fix the issue的小提琴。后者表明，如果你现在不能升级到1.10.1+，你可以只包括以下CSS：

.ui-helper-clearfix:after {
    border-collapse: collapse;
}