Having trouble with desktop formatting on responsive tables
Having trouble with desktop formatting on responsive tables

https://iswisstools.com/products/double-ended-holders-with-inner-coolant/:
https://debug.datatables.net/igunat:
Error messages shown: N/A
Description of problem: The problem with the site is that when the responsive plugin is enabled - the columns are TOO wide on the page and don't correctly redraw. Not sure how to fix but here is a picture:
Any help would be great!
This discussion has been closed.
Answers
Hi,
I've just tried your page in both Firefox and Chrome, but it appears to be working okay. What bowser are you using there (looks like Chrome?).
If you click to sort a column header, does it snap back into place (width-wise)? If so, you might need to call
responsive.recalc()
when the table is drawn.Allan
Thanks for the quick response. Clicking on sorting a column header unfortunately doesn't work. The browser I'm using is Chrome on Mac.
The problem seems to exist after the viewport is 1024px. Once that width is hit the table doesn't seem to properly calculate the width and draws the table as if the entire viewport was around 1400px.
Being that the width of all the columns are set, this causes the table to overflow.
Hi,
Thanks. I'm seeing the error as well now when I resize my browser window. I'm going to have to trace this one through - could you replace the minified Responsive Javascript ( https://iswisstools.com/wp-content/themes/child-theme/js/dataTables.responsive.min.js ) with the debug version please ( https://nightly.datatables.net/responsive/js/dataTables.responsive.min.js )?
Thanks,
Allan