Duplicate empty header occur in datatable when enabling scrollX or scrollY when using Google Chrome

Question

I have a datatable in my program. And I want it to be scrollable horizontally so what I did was like this:

var tableI = $(\'#table_data\').DataTable({
    \"bLe         


        

Answer 1

The solution was simple in my case. Just include this on your css:

/* Override sorting header --> DataTable Bug */
.dataTables_scrollBody > table > thead > tr {
    visibility: collapse;
    height: 0px !important;
}