DataTable Column headers not aligning correctly when table starts

Alex92

Hi all,
I not too sure what is happening and why but when the table first launch the column headers don't align with the columns. The columns get readjusted when sorted or screen resized. Any idea why? Thank you.

My code:
$(window).bind('resize', function () {
oTable.fnAdjustColumnSizing();
});
jQuery('.dataTable').wrap('

');

                             var table = $('#example').DataTable({
                                 dom: 'Bfrtip',
                                 data: data,
                                 columns: cols,
                                 "scrollX": "90%",
                                 "scrollCollapse": true,
                                 "scrollY": "200px",
                                 "columnDefs": [{
                                    "targets": [0],
                                    "visible": false,
                                    "searchable": false
                                 },
                                 {
                                     "targets": [10],
                                     "render": function (data, type, full) {
                                         return data.toString().match(/\d+(\.\d{1,1})?/g)[0];
                                     }


                                 }, {

                                     "targets": [7],
                                     "render": function (data, type, full, meta) {
                                         var date = new Date(data);
                                         var options = { year: "numeric", month: "long", day: "numeric" };
                                         if (data == null || data == '') {
                                            return "No Date"

                                         } else {
                                             return date.toLocaleDateString('en-US', options);
                                         }


                                     }

                                 }],
                                 destroy: true,
                                 buttons: [{
                                     extend: 'copy',
                                     exportOptions: {
                                         columns: ':visible'
                                     }
                                 }, {
                                     extend: 'csv',
                                     exportOptions: {
                                         columns: ':visible'
                                     }
                                 }, {
                                     extend: 'excel',
                                     exportOptions: {
                                         columns: ':visible'
                                     }
                                 }, {
                                     extend: 'pdf',
                                     exportOptions: {
                                         columns: ':visible'
                                     }
                                 }, {
                                     extend: 'print',
                                     exportOptions: {
                                         columns: ':visible'
                                     }
                                 }],

                             });
                             $(".dataTables_scrollHeadInner").css({ "width": "100%" });

                             $(".table ").css({ "width": "100%" });