problem with table in div/overflow property

[Marcus]

Hello,

I am trying to display a large table of data in a div with scroll bars -
the table represents a daily schedule, and I would like to do this so
that the user can scroll around the table without the width affecting
how the rest of the page is displayed.

I have it "working", except that the table just fills the div's width to
100%, which is not the effect I want. With a lot of data, this causes
each cell to display multiple lines of data and the table becomes
scrunched up.

Instead, I would like the table to just continue in the x and y
directions and display everything on 1 line per cell. I know that if I
specify an absolute pixel width that is large enough for the table, or
if I say something like width="200%", I get the effect I am talking
about, but since the data is generated dynamically there is no way I can
specify in advance how wide the table should be. I would like the table
width to be the minimum width necessary to display everything on 1 line.

Here is my code for the scroll div:

div.view_schedule { overflow: scroll; height: 400px; width: 700px;
border: 1px solid #000000; padding: 10px; }

Thank you all in advance!!

 

[Adrienne]

Hello,

I am trying to display a large table of data in a div with scroll bars -
the table represents a daily schedule, and I would like to do this so
that the user can scroll around the table without the width affecting
how the rest of the page is displayed.

Instead, I would like the table to just continue in the x and y
directions and display everything on 1 line per cell. <snip>
I would like the table
width to be the minimum width necessary to display everything on 1 line.

Here is my code for the scroll div:

div.view_schedule { overflow: scroll; height: 400px; width: 700px;
border: 1px solid #000000; padding: 10px; }

div.view_schedule td {white-space:nowrap} will force the content to not
word wrap