Datatable header is misaligned with data in datatble when there is ScrollX and ScrollY in jquery

Question

Hi I'm using Jquery Datatable, And for scrolling I'm using "scrollX" : true, "scrollY": '65vh', but problem is in sometimes table header is misalligned with table data,

I tried this :

$.fn.dataTable.tables(true).DataTable().columns.adjust();

but it's not working for me, can anybody suggest some solution.

Sample Code:

.DataTable( { "dom" :dom,

                        "oColVis": { "aiExclude": config.data.exclude},     
                        "processing" : true,
                        "lengthChange" : true,
                        "serverSide" : (!config.data.serverType || config.data.serverType ==="serverSide")?true:false,
                        "sort" : true,
                        "info" : true,
                        "conditionalPaging": true,
                        "responsive": true,
                        "jQueryUI" : false,
                        "order" : orderBy,// [ [ config.data.orderby,
                                            // config.data.ordertype ||
                                            // "desc" ] ],
                        "scrollX" : true,
                        "scrollY": '65vh',
                        "scrollCollapse": true,
                        "pageLength":pageLength,
                        "autoWidth" : false,

)

question from:https://stackoverflow.com/questions/65829600/datatable-header-is-misaligned-with-data-in-datatble-when-there-is-scrollx-and-s

Answer 1

Waitting for answers