Table width to "auto" using column width, bAutoWidth, etc.?

joelparkerhenderson

How do I set a table to use the browser's auto width?

For example: column 1 has "foo", column 2 has "bar".

Using plain HTML, the browser makes the table approximately 6 letters wide plus a little padding and spacing.

But using DataTables, the table width expands to almost the full width of my browser.

I have tried setting "bAutoWidth": false (and also tried true) but it doesn't seem to make a difference.

I have tried using "aoColumns": [null, null] but it doesn't seem to make a different either.

My preference is to skip using "aoColumns" because I would rather not have to pass in [null, null, ...] for long tables; in addition my page has dynamic tables where the number of columns is not known until runtime.

Essentially, I want the browser calculating the column widths the way it does with plain HTML.

In case it's helpful to know, I'm using current Firefox & Chromium on Ubuntu.

Any pointers or guidance? Thanks very much, Joel

allan

Hi Joel,

Are you using the DataTables default CSS files? If so, you'll find the following rule in it:

[code]
table.dataTable {
width: 100%;
}
[/code]

That is what is forcing the table width to be huge. If you just remove that, DataTables will respect the width assigned to the table by the browser (the one exception to that rule is if you have scrolling enabled, sScrollY / sScrollY - where the width will be forced to 100% to ensure concistency of width application across browsers - in that case a containing element can be used with a smaller width).

Regards,
Allan

joelparkerhenderson

Thanks Allan, that did the trick. And thanks for the PayPal help too... your software is terrific!