a side-effect of vertical scroll feature creating two thead sections
a side-effect of vertical scroll feature creating two thead sections
(not a bug report, but maybe someone finds this useful.. a workaround I had to use for a side-effect of my css)
The problem I faced was that in my table css I defined a default tr height.. The vertical scroll feature of dataTables seems to create two divs to separate out the table header from the table body; the normal table header gets placed in dataTables_scrollHead and the normal table body in dataTables_scrollBody, but both of them gets a thead section.. The thead section in dataTables_scrollBody had empty cells (well, a single space each) but my table class's tr height applied here as well, which added unnecessary whitespace at the top of the scrollable table body.
My first instinct was to add this CSS:
.dataTables_scrollBody table thead { display:none; }
but I saw that dataTables gets the column width for the table inside dataTables_scrollHead from the thead I just killed..
What ended up really working for me was:
.dataTables_scrollBody table thead tr { height:0px; }
my regards,
Riaan
The problem I faced was that in my table css I defined a default tr height.. The vertical scroll feature of dataTables seems to create two divs to separate out the table header from the table body; the normal table header gets placed in dataTables_scrollHead and the normal table body in dataTables_scrollBody, but both of them gets a thead section.. The thead section in dataTables_scrollBody had empty cells (well, a single space each) but my table class's tr height applied here as well, which added unnecessary whitespace at the top of the scrollable table body.
My first instinct was to add this CSS:
.dataTables_scrollBody table thead { display:none; }
but I saw that dataTables gets the column width for the table inside dataTables_scrollHead from the thead I just killed..
What ended up really working for me was:
.dataTables_scrollBody table thead tr { height:0px; }
my regards,
Riaan
This discussion has been closed.
Replies
Thanks for posting this, I'm sure others will find it useful. I think this is perhaps something that DataTables should do automatically - it already sets the height for the TD elements in the 'inner' header to 0 - so it should perhaps do the same for the TR element. I'll have a look into it and see if a fix is suitable to put into the code, or if the CSS statement you suggest above is overall better.
Regards,
Allan
I appear to be having the same issue. however the fix you have supplied did not work sadly.
any other thoughts?