jQuery Datatables Header Misaligned With Vertical Scrolling

Question

I\'ve posted this in the datatables.net forums, but after a week, still no response. Hopefully I can find help here...

I\'m using datatables version 1.8.1 and am ha

Answer 1

Having the same problem in firefox, I changed a little the script jquery like this (in jquery.dataTables.js version 1.9.4) :

line 3466 (v1.9.4) : nScrollHeadInner.style.paddingRight = "0px"; //instead of bScrolling ? o.oScroll.iBarWidth + "px" : "0px";

line 3472 (v1.9.4) : nScrollFootInner.style.paddingRight = "0px"; //instead of bScrolling ? o.oScroll.iBarWidth + "px" : "0px";

It works even after sorting and filtering.

Answer 2

I had a problem where the data in the columns was too large to fit and there was no place in the data for a line break. My solution was to add a div with an overflow and a title attribute like this:

<td style="width: 110px;max-width:200px;"><div style="overflow:hidden;" title="@item.NewValue" >@item.NewValue</div></td>

This caused the table to settle down almost completely.