column header not allineate when use scroller datatables

Itamarcus

I have the problem highlighted in the image.

the code is:

        var BarriereTable = $('#BarriereDatatable').DataTable({
                        destroy: true,
                        deferRender: true,
                        scrollY: '38vh',
                        scrollCollapse: true,
                        scroller: true,
                        paging: true,
                        sort: true,
                        //pageLength: 5,
                        lengthChange: false,
                        "lengthMenu": [[5, 10, 25, 50, -1], [5, 10, 25, 50, "All"]],
                        searching: true,
                        select: true,
                        "ajax": {
                            type: "GET",
                            url: '/api/SIT/TabellaBarriere',
                            "dataSrc": "",
                            contentType: "application/json",
                            error: function (xhr, status, error) {
                                alert(xhr.responseText);
                            },
                        },

                        "initComplete": function (settings, json) {
                            CaricaBarriereSuMappa(json)
                        },

                        "columns": [
                            { "data": "IdBarriera", "autoWidth": true, "visible": false },
                            { "data": "StradaBarriera", "autoWidth": true },
                            { "data": "TipoBarriera", "autoWidth": true },
                        ]
                    });

the problem depends on the scroller Y. if it is eliminated the problem does not occur.

I also noticed that if I click on the column header or resize the page, the headers line up with the table automatically.

any idea to resolve this?

kthorngren

If the Datatable is hidden when initialized then displayed, such as using tabs, then you will need to use columns().adjust() when the tab is shown.

Otherwise its probably a CSS issue which would be difficult to solve without seeing your page. Please post a link to your page or a test case replicating the issue.
https://datatables.net/manual/tech-notes/10#How-to-provide-a-test-case

Kevin