hot to align inner table cols with outer table cols

Discussion in 'HTML' started by phl, May 23, 2006.

  1. phl

    phl Guest

    hi,

    I have data which I display in a table with 5 columns, some of this
    data needs to be collapsable, so user can hide it if they wish. I am
    trying to do this with a main table of 5 columns for none collapsable
    data and inner tables of the same demensions for collapasable items,
    with is displayed or hiddened depending what user selects, using
    jscript. The html would look like this:

    <table border="1" id="table1">
    <tr>
    <td style="width: 400px">hello</td>
    <td>world</td>
    </tr>
    <tr>
    <td colspan="2">
    <table border="1" id="table2">
    <tr align="left">
    <td style="width: 400px">hello new</td>
    <td>world</td>
    </tr>
    </table>
    </td>
    </tr>
    </table>

    The problem is with this layout the inner table is shifted a little to
    the right, hence the columns of the inner and outer table aren't
    matching properly.

    Can anyone help or provide alternative method?

    Thanks
    -phl
     
    phl, May 23, 2006
    #1
    1. Advertising

  2. phl

    Sid Ismail Guest

    On 23 May 2006 01:59:46 -0700, "phl" <>
    wrote:

    : hi,
    :
    : I have data which I display in a table with 5 columns, some of this
    : data needs to be collapsable, so user can hide it if they wish. I am
    : trying to do this with a main table of 5 columns for none collapsable
    : data and inner tables of the same demensions for collapasable items,
    : with is displayed or hiddened depending what user selects, using
    : jscript. The html would look like this:
    :
    : <table border="1" id="table1">
    : <tr>
    : <td style="width: 400px">hello</td>
    : <td>world</td>
    : </tr>
    : <tr>
    : <td colspan="2">
    : <table border="1" id="table2">
    : <tr align="left">
    : <td style="width: 400px">hello new</td>
    : <td>world</td>
    : </tr>
    : </table>
    : </td>
    : </tr>
    : </table>
    :
    : The problem is with this layout the inner table is shifted a little to
    : the right, hence the columns of the inner and outer table aren't
    : matching properly.
    :
    : Can anyone help or provide alternative method?


    It's the default cellspacing and cellpadding. Set them to zero in the
    inner table.

    Sid
     
    Sid Ismail, May 23, 2006
    #2
    1. Advertising

  3. phl

    phl Guest

    thanks that helped alot.

    why is it that if I set the a width to say "700px" in the outer table,
    the cols in the inner table becomes unaligned with the outer? Is there
    anyneed to set table width once I have all tables width set?
     
    phl, May 23, 2006
    #3
    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. lonelyplanet999

    Access outer / inner class variables query

    lonelyplanet999, Nov 11, 2003, in forum: Java
    Replies:
    3
    Views:
    5,340
    lonelyplanet999
    Nov 18, 2003
  2. lonelyplanet999
    Replies:
    1
    Views:
    2,286
    VisionSet
    Nov 13, 2003
  3. Yamin
    Replies:
    4
    Views:
    16,844
    Yamin
    Oct 24, 2004
  4. phl
    Replies:
    1
    Views:
    4,434
    Martin Jay
    Jun 8, 2006
  5. Newbie
    Replies:
    4
    Views:
    1,466
    Newbie
    Aug 23, 2006
Loading...

Share This Page