JQuery UI选项卡未正确显示 - Internet Explorer

Question

我正在尝试使用Jquery UI标签，我遇到了他们网站上的演示问题。它在我自己的网站上运行正常，但当我下载源和所有其他文件在我的机器上运行它时，它最初正确呈现如下： 但是当我点击任何其他标签时，它们会像这样渲染：

单击最左边的选项卡总是让事情看起来正确，但是单击其他选项卡会导致我圈出的线不会被渲染。它适用于Firefox和Chrome。 有没有人以前见过这样的东西？

我真的很感激你的建议。

谢谢，
-Mark

Answer 1

我发现了这个问题。它在JQueryUI CSS中。它定义了.ui-tabs .ui-tabs-nav li元素，如下所示：

.ui-tabs .ui-tabs-nav li { list-style: none; float: left; position: relative; top: 1px; margin: 0 .2em 1px 0; border-bottom: 0 !important; padding: 0; white-space: nowrap; }

什么时候应该

.ui-tabs .ui-tabs-nav li { list-style: none; float: left; position: relative; top: 1px; margin: 0 .2em -1px 0; border-bottom: 0 !important; padding: 0; white-space: nowrap; }

即。对于margin

，1px应为-1px