Stop Column Headers From Wrapping

vetterj73

From the image below you can see that my columns are wrapping when there isn't enough real estate. I would prefer it just to scroll.

Here is how I setup my data table:

$(#${dataTableTableId}).dataTable({
scrollX: true,
"layout": {
topStart: 'buttons',
topEnd: 'search',
},
"aaSorting": [[sortColumn, "asc"]],
"responsive": true,
"orderMulti": false,
"info": false,
"ordering": true,
"paging": false,
"searching": true,
"columns": columnData,
"buttons": buttonCollection
});

How can I change it so the columns don't wrap?

allan

You've enabled that behaviour by adding:

"responsive": true,

Remove that option if you don't want it to remove columns to fix into the current viewport.

Allan