How to make cells of an HTML table expand horizontally outside the page?

Question

I have a table with many columns. The table is wider than the page, and therefore it scrolls. The default behavior of the tables, apparently, is to make the width of each column as small as possible and allow text to flow to a new line.

Instead, I would like my table cells to expand horizontally with their contents and never spill over onto the second row. Is CSS possible? If not, does anyone have pointers on how I can start doing this using Javascript (jQuery if poss)?

Answer 1

You can use:

td { white-space: nowrap; } 

Answer 2

I think this may be what you want. http://geekswithblogs.net/TimH/archive/2006/04/16/75318.aspx

Using

  white-space: nowrap; 

will cause the cell to take up as much space as needed.

Answer 3

You can set the table width to 100% or *.