JQuery Datatable: Fit column width to content

Question

I am building a DataTable on the fly, so I don't know the column content upfront. I would like to obtain a table for which each column width fits its content width. I tried to manipulate "autoWidth", but it resizes columns according to their number and to the table width, but all columns have the same width. How can I let each column adjust its width according to its own content?

Answer 1

You can use autoWidth: true along with columns.adjust() API method to adjust column width after you done adding data to the table.

Answer 2

in my case,
i needed to fit / collapse table width down to the content. autowidth: true wasn't enough. It also needed display:inline-table .

if i dont put inline-table, table expands to full width of page.

    /*  put 2 tables side by side */ 
    .dataTables_wrapper {
        display: inline-table;

        /* below optional .*/
        --width: auto;
        --max-width: 45%;
    }