problem with table in div/overflow property

Discussion in 'HTML' started by Marcus, Jun 7, 2005.

  1. Marcus

    Marcus Guest

    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!!
     
    Marcus, Jun 7, 2005
    #1
    1. Advertising

  2. Marcus

    Adrienne Guest

    Gazing into my crystal ball I observed Marcus <> writing
    in news:h3ppe.8542$:

    > 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


    --
    Adrienne Boswell
    http://www.cavalcade-of-coding.info
    Please respond to the group so others can share
     
    Adrienne, Jun 8, 2005
    #2
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Andrey Tarasevich

    Div bumping and 'overflow' property

    Andrey Tarasevich, Sep 7, 2007, in forum: HTML
    Replies:
    1
    Views:
    1,067
    Ben C
    Sep 7, 2007
  2. Matt White

    DIV inside DIV overflow issue

    Matt White, Feb 25, 2009, in forum: HTML
    Replies:
    6
    Views:
    3,199
    Chaddy2222
    Feb 26, 2009
  3. K Viltersten

    <div ... /> and <div ...></div>

    K Viltersten, Mar 30, 2009, in forum: ASP .Net
    Replies:
    4
    Views:
    790
  4. Dwayne Madsen

    Q: Div A inside Div B is larger than Div B

    Dwayne Madsen, Jun 1, 2005, in forum: Javascript
    Replies:
    1
    Views:
    219
    David Dorward
    Jun 1, 2005
  5. mscir
    Replies:
    3
    Views:
    343
    Martin Honnen
    Jun 26, 2005
Loading...

Share This Page