Data misaligned with column headers when horizontal scrolling
Data misaligned with column headers when horizontal scrolling
sjon.benson@ltstream.com
Posts: 2Questions: 0Answers: 0
Hello!
The test case is on your documentation page titled Scrolling and Bootstrap tabs
Shrink the width of your window to 425px wide and it will cause a horizontal scrollbar for the tables in the "Table 1" and "Table 2" tabs. If you scroll it all the way to the right you will notice the column headers stay static and the data columns in the rows beneath scroll, making the column headers stop aligning with the data.
I see the same issue with wider tables in my app, mutiple pages both with and without Bootstrap tabs. I see the symptom occur when the following options are applied:
scrollY: 200,
scrollCollapse: true,
paging: false
DataTables version: 1.10.21 (though I believe this may affect multiple versions)
I believe even having scrollCollapse set to false will still cause the issue.
This seems like a bug to me, but am happy to be correct if there is a way I keep the column headers aligned with the data when scrollY is enabled and a horizontal scroll is forced due to the number of columns over-running the available width.
Replies
Yep, that looks wonky to me. I've raised it internally (DD-1822 for my reference) and we'll report back here when there's an update.
Cheers,
Colin
Thanks @colin! I look forward to your update.