Table widths problem

Collapse
This topic is closed.
X
X
Collapse
 
  • Page of 1
  • Time
  • Show
Clear All
new posts
Previous template Next
  • kiran
    #1

    Table widths problem

    Hi All

    I have 2 tables, Table1's width is specified as 100% and Table2's
    width as 1004px.

    If the page is viewed in 1024 res, both tables stretch across the
    window, but if the window is resized (say about 500px wide), then
    Table1's width is 500px but Table2 still stretch across the window.

    Is it possible to make Table1 also to stretch across the window, on
    resize? (Table2's width is dynamic, actually it holds a menu and its
    width depends on the number of menu items.)

    This is the page I was referring to:

    <html>
    <head>
    <body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0 ">

    <table width="100%" border="0" cellpadding="0" cellspacing="0"
    bgcolor="#FFFFC C">
    <tr>
    <td>Table1</td>
    </tr>
    </table>
    <br>

    <table width="1004" border="0" cellpadding="0" cellspacing="0"
    bgcolor="#00CCF F">
    <tr>
    <td>Table2</td>
    </tr>
    </table>

    </body>
    </html>


    Thanks in advance
    Kiran M N
    Tags: None
    • Mark Tranchant
      #2
      Re: Table widths problem

      kiran wrote:[color=blue]
      > Hi All
      >
      > I have 2 tables, Table1's width is specified as 100% and Table2's
      > width as 1004px.
      >
      > If the page is viewed in 1024 res, both tables stretch across the
      > window[/color]

      ....assuming the user has maximized the browser, and the browser window
      is the full width of the screen with no sidebars...
      [color=blue]
      > but if the window is resized (say about 500px wide), then
      > Table1's width is 500px but Table2 still stretch across the window.[/color]

      As you requested. 100% refers to the viewport width.
      [color=blue]
      > Is it possible to make Table1 also to stretch across the window, on
      > resize? (Table2's width is dynamic, actually it holds a menu and its
      > width depends on the number of menu items.)[/color]

      You mean you generate the 1004px number server-side, I presume. You're
      not being very clear with your question, and as usual, a URL would help.

      Am I righ in thinking you want both tables the same width, and that
      width is determined by the size of the second table? If I'm right, you
      might find that enclosing them both in a <div> would do the trick.

      The real lessons here are:

      1) Don't use tables for layout, it's messy
      2) Don't make assumptions about window size, design fluidly
      3) Don't force horizontal scrolling on users, it's *really* annoying

      If I came across a 1004px wide fixed design site, I'd leave.

      --
      Mark.
      http://tranchant.plus.com/

        Comment

        Previous template Next
        Working...