为什么 data-table table last header 与最后一列不对齐?

Why does data-table table last header not align with last column?

我使用 DataTable 库创建了一个 table(即使用 foundation-zurb 5.5.3),根据下图,我在 Chrome 和 IE 11 中都看到了最右栏 header does not align with the other rows when you first open up the page. The actual webpage is http://iprobesolutions.com/learn/wireless-conference-system-comparison。但是,如果我打开 devtools 尝试检查代码,问题就会消失!但是,当我使用 CTRL+ F5 刷新时,它又出现了。

创建这个fiddle时没有出现问题:http://jsfiddle.net/setbon/x75o53ck/

下面只是粘贴了一小部分代码。如果您能查看该网页,我将不胜感激,因为这是显示问题的地方...可能是 IE 和 Chrome ?

中的错误
<table id="example" class="display nowrap table1 compact">

通常,当 table 在初始化时隐藏,然后在选项卡、模态对话框等中可见时,通常会出现此类问题。

在大多数情况下,解决方案是调用 columns.adjust() 在 table 可见后重新计算列宽。

table.columns.adjust();

当我 运行 在你的 table 初始化后上面的代码时,问题消失了。

我无法解释为什么您的 table 会出现此问题。我不熟悉 Foundation 框架,但我认为初始化 table.

时不必调用 foundation()

有关更多信息、示例和详细信息,请参阅 jQuery DataTables: Column width issues with Bootstrap tabs

我看到您正在加载 Datatables FixedHeader 代码。我不知道你是如何使用它的,或者你是否在使用它,但它与 scrollX 和 scrollY 不兼容: https://datatables.net/extensions/fixedheader/

尝试删除 FixHeader 或滚动选项。