Table Initial Render overflows

Table Initial Render overflows

iiDeSTRoYeRiiDeSTRoYeR Posts: 2Questions: 1Answers: 1

Description of problem: I'm using Turbolinks on my site to enable PJAX navigation. A problem with datatables occurs when the page is loaded but the table itself overflows the datatable wrapper. Any interaction on the table (e.g., moving a column...) rerenders the table into its correct shape. I've tried to use the "setTimeout" function to delay the initialization of the table but it's a hit or miss and not very elegant to use such delay.

Overflown Table render:
Overflown Table render

Correct Table Rendering:
Correct Table Rendering

This question has an accepted answers - jump to answer

Answers

  • allanallan Posts: 61,446Questions: 1Answers: 10,054 Site admin

    If you could like a page showing the issue and I help to try and debug it.

    Thanks,
    Allan

  • iiDeSTRoYeRiiDeSTRoYeR Posts: 2Questions: 1Answers: 1
    Answer ✓

    After localizing the issue, it seems that a local CSS styling is the issue of the problem as it loads after the script is executed for initializing the datatable. This CSS file causes the table to change its place hence this overflowing issue.
    Fixed it by moving the CSS file to the head of the base HTML template which solved the loading priority.
    Thanks,

Sign In or Register to comment.