problem fixedHeader

ramylson

I'm having an issue where the header (thead) becomes misaligned from the table body when I use fixedHeader with scrollX. Does anyone know how to resolve this?

code:
$('#table').DataTable({
order: [],
displayLength: 100,
fixedHeader: {
header: true,
},
scrollCollapse: true,
scrollX: true
});

kthorngren

It FixedHeader and scrollX work in this example. Typically its one of two things:

1. The style integration files haven't been loaded for the style framework being used. Use the Download Builder to get the proper files.
2. The table is hidden when initialized so the proper width hasn't been calculated. Use columns.adjust() and fixedHeader.adjust() when the table becomes visible. Similar to this example.

If these don't help then we will need to see a link to a test case showing the issue to help debug.
https://datatables.net/manual/tech-notes/10#How-to-provide-a-test-case

Kevin

ramylson

I added the following command, and it worked exactly as described, functioning perfectly for me:

$(document).ready(function() {
table.fixedHeader.adjust();
table.columns.adjust().draw();
});

thanks