The dataTable works perfectly when the window is set to one screen size (width). However, when the screen width is changed, the table head does not resize automatically. This issue seems to occur only when the scrollY property is set on the dataTable. Once scrollY is set, jQuery dataTable creates two tables - one for the table head and another for the table body for scrolling. In my case, the table for the table head does not work properly.
image: https://i.sstatic.net/0nxyJ.png
code:
$('#<%= GridView1.ClientID %>').DataTable({
scrollY: 200,
scrollX: false,
columnDefs: [
{targets: 1 }
],
responsive: true,
"scrollCollapse": true,
"paging": false
});
any suggestions?