2017-07-30 19 views
0

我創建了一個帶有DataTable庫(使用foundation-zurb 5.5.3)的表格,根據下面的圖片,我在Chrome中看到了IE 11中最右列標題the most right column header未與其他行對齊當你第一次打開頁面。實際的網頁是http://iprobesolutions.com/learn/wireless-conference-system-comparison。但是,如果我打開devtools來嘗試檢查代碼,這個問題就消失了!當我用CTRL + F5刷新時,它會重新出現。爲什麼數據表表格最後的標題與最後一列不一致?

當我創建這個小提琴的問題不會出現:http://jsfiddle.net/setbon/x75o53ck/

下面是粘貼代碼的只是一小部分。我真的很感激,如果你可以看看網頁,因爲這是顯示問題的地方......也許是IE和Chrome中的錯誤?

<table id="example" class="display nowrap table1 compact"> 

回答

1

我看到你正在加載Datatables FixedHeader代碼。我看不到如何或如果你使用它,但它不與scrollX和scrollY兼容: https://datatables.net/extensions/fixedheader/

嘗試刪除FixHeader或滾動選項。

+0

根據我們的convo在datatables論壇...許多tx爲你的幫助凱文! –

0

通常這些類型的問題發生時,當初始化表被隱藏,然後在一個標籤中,模態對話框等

在大多數情況下,溶液是調用 columns.adjust()重新計算列寬度變得可見一旦表格變得可見。

table.columns.adjust(); 

當我在表初始化後運行上面的代碼時,問題消失。

我無法解釋爲什麼這個問題與您的表發生。我不熟悉Foundation框架,但我不認爲在初始化表格時您必須調用foundation()

有關更多信息,示例和詳細信息,請參閱jQuery DataTables: Column width issues with Bootstrap tabs

+0

非常感謝您的迴應。我把你的代碼放在下面,但沒有任何反應......請問我應該粘貼這行代碼的正確位置是什麼? ()#example_wrapper .small-6.columns:eq(0)'); table.columns.adjust()。draw(); ();基礎(); –

+0

我把你的代碼行放到了我更新JS代碼的小提琴中:http://jsfiddle.net/setbon/m1Lg8h9f/ –

+0

當你有機會的時候,如果你能在過濾放置代碼的位置。 –

相關問題