DataTable header row width is not aligning with body row width
DataTable header row width is not aligning with body row width
ArchanaHarikumar
Posts: 2Questions: 2Answers: 0
I am giving data to the table in javascript, but the table structure available in the Html as shown below.
In HTML:
<table id="searchListTable" width="100%" class="display nowrap order-column row-border">
<thead>
</thead>
<tbody>
</tbody>
</table>
In JS:
$("#searchListTable thead").html(strHead);
$("#searchListTable tbody").html(str);
$("#searchListTable").DataTable({
"order": [[2, "asc"]],
searching: false,
paging: false,
info: false,
"bSort": true,
"scrollY": "300px",
"scrollCollapse": true,
"scrollX": true
});
I am creating this table inside of a bootstrap modal dialog and for the first time the header row is shorter than the rows in the table body. After resizing the dialog, it becomes the same width as that of body rows(refer image attached).Any help would be great..!! 
This question has an accepted answers - jump to answer
Answers
See this example of how to use
columns.adjust()when showing a hidden Datatable.Kevin