DataTables now applying 0px width and squashing content

sjw01

I am not sure if something has changed however, my DataTables have all started squashing up inside the browser, wrapping all text within the cells to a minimum width instead of neatly expanding to the the div container.

I have noticed that an inline style of width: 0px is being applied to the table. I have checked everywhere and I cannot see anywhere that I have applied a 0px width so I am assuming this is a "feature" of DataTables?

1. Is it normal to have a width: 0px applied to all DataTables?
2. Is there a way to stop it?

colin

We're happy to take a look, but as per the forum rules, please link to a test case - a test case that replicates the issue will ensure you'll get a quick and accurate response. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.

Cheers,

Colin

sjw01

I found a solution to this.
The problem appeared to be an initialisation issue. If the table is initialised before the data is ready, the table initalizes with a 0px width because there is no data for the DataTable to estimate required width.
I fixed this by adding a small timeout before initialising:

setTimeout(function(){initialiseDataTable();}, 100);

kthorngren

Do you have style="width:100%" applied to the table tag as shown in this example?

Kevin