Table always takes up all browser width

pinkisntwell

I have a table that will always take the whole browser width, no matter what sWidth I specify in aoColumns, no matter whether I specify bAutoWidth, and no matter if I drop some columns (with bVisible = false). Here is the problematic webpage: www.statsfair.com/pinnacle/.

Is there a way to make the table take up less space?

tangerine

jquery.dataTables.css specifies a dataTable width of 100%. Change it, or use your own CSS, or put your table inside a container.

sfgolfer

I agree with @tangerine.

Put the table inside a and use CSS to control its width. That's what I had to do with mine.

pinkisntwell

Well the table is already inside a div but the problem is that dataTables puts an explicit

width: 1556px

on the table element. If I change that to something smaller it works but then the buttons for previous page stay in their position (to the very right of the page). I have to change the buttons' positions separately and this is not easy to do.

Why is it so hard to specify the width of everything that dataTables puts on the page? Am I the only one that doesn't want the table to take up the whole page?

tangerine

According to the page source at www.statsfair.com/pinnacle/ your table is not inside a div.
Also I think you need to run a HTML validator over the page.

pinkisntwell

The table *is* inside a div, the one that datatables adds. I tried changing the css on that using Firebug and it doesn't work. I also tried to put a div of my own and do the same, but it still doesn't work, table overflows.

allan

We'd probably need a link to see what is going wrong, since there are so many variables as to what could be causing the problem :http://datatables.net/forums/discussion/12899/post-test-cases-when-asking-for-help-please-read

Allan