Problem with column widths in a table

Discussion in 'HTML' started by Martin, Apr 8, 2005.

  1. Martin

    Martin Guest

    I trying to generate a table laid out like this:

    |----------|-----------------------------------------------|
    | | - - - - - Some Text Here - - - - - |
    |----------|-----------------------|-----------------------|
    | | And Here Too | And Here Three |
    |----------|-----------|-----------|-----------|-----------|
    | | ABC | DEF | | |
    |----------|-----------|-----------|-----------|-----------|
    | | | XSW | 123 | |
    |----------|-----------|-----------|-----------|-----------|

    That is, all of the columns being the same size with
    some columns having "headers".

    I would like to specify the overall width of the table
    to be a percentage and the columns to be a percentage of
    the table width.

    I'm using:
    <TABLE width="80%" cols=5>

    And then:
    <COLGROUP>
    <col width="20%">
    <col width="20%">
    <col width="20%">
    <col width="20%">
    <col width="20%">
    </COLGROUP>

    But, when I try to specify the various colspans,
    the width of the columns seems to revert to
    some kind of default (with the width depending
    on how much data is in the cell).

    <tr>
    <td>&nbsp;</td>
    <td colspan=4>- - - - - Some Text Here - - - - -</td>
    </tr>

    <tr>
    <td>&nbsp;</td>
    <td colspan=2>And Here Too</td>
    <td colspan=2>And Here Three</td>
    </tr>

    <tr>
    <td>&nbsp;</td>
    <td>ABC</td>
    <td>DEF</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    </tr>

    Can someone give me a clue as to what I'm doing wrong here?

    Thanks.
    Martin, Apr 8, 2005
    #1
    1. Advertising

  2. Martin

    Csaba Gabor Guest

    My Firefox 1.0.1+ displays your table as expected.
    However, IE really munges it up, allocating 50% to
    the 1st column and 50% to the remaining columns
    (which are grouped by a single colspan).

    Shooting from the hip, seems like IE might be off.
    If you insert the following ugly html right after the
    </COLGROUP>, the situation improves dramatically:

    <tr style="display:none"><td>&nbsp;</td><td>&nbsp;</td>
    <td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td></tr>

    Csaba Gabor from Vienna

    Also, during development, <table border> is your friend.



    Martin wrote:
    > I trying to generate a table laid out like this:
    >
    > |----------|-----------------------------------------------|
    > | | - - - - - Some Text Here - - - - - |
    > |----------|-----------------------|-----------------------|
    > | | And Here Too | And Here Three |
    > |----------|-----------|-----------|-----------|-----------|
    > | | ABC | DEF | | |
    > |----------|-----------|-----------|-----------|-----------|
    > | | | XSW | 123 | |
    > |----------|-----------|-----------|-----------|-----------|
    >
    > That is, all of the columns being the same size with
    > some columns having "headers".
    >
    > I would like to specify the overall width of the table
    > to be a percentage and the columns to be a percentage of
    > the table width.
    >
    > I'm using:
    > <TABLE width="80%" cols=5>
    >
    > And then:
    > <COLGROUP>
    > <col width="20%">
    > <col width="20%">
    > <col width="20%">
    > <col width="20%">
    > <col width="20%">
    > </COLGROUP>
    >
    > But, when I try to specify the various colspans,
    > the width of the columns seems to revert to
    > some kind of default (with the width depending
    > on how much data is in the cell).
    >
    > <tr>
    > <td>&nbsp;</td>
    > <td colspan=4>- - - - - Some Text Here - - - - -</td>
    > </tr>
    >
    > <tr>
    > <td>&nbsp;</td>
    > <td colspan=2>And Here Too</td>
    > <td colspan=2>And Here Three</td>
    > </tr>
    >
    > <tr>
    > <td>&nbsp;</td>
    > <td>ABC</td>
    > <td>DEF</td>
    > <td>&nbsp;</td>
    > <td>&nbsp;</td>
    > </tr>
    >
    > Can someone give me a clue as to what I'm doing wrong here?
    >
    > Thanks.
    >
    >
    Csaba Gabor, Apr 9, 2005
    #2
    1. Advertising

  3. Martin

    Martin Guest

    Thank you, thank you, thank you !!!

    I've been screwing around with this for several hours.

    Your fix works perfectly.

    BTW, the real table has borders and a bunch of other stuff - I just
    left all that out for this example.

    Thanks again.



    On Fri, 08 Apr 2005 23:06:36 GMT, Csaba Gabor <> wrote:

    >My Firefox 1.0.1+ displays your table as expected.
    >However, IE really munges it up, allocating 50% to
    >the 1st column and 50% to the remaining columns
    >(which are grouped by a single colspan).
    >
    >Shooting from the hip, seems like IE might be off.
    >If you insert the following ugly html right after the
    ></COLGROUP>, the situation improves dramatically:
    >
    ><tr style="display:none"><td>&nbsp;</td><td>&nbsp;</td>
    ><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td></tr>
    >
    >Csaba Gabor from Vienna
    >
    >Also, during development, <table border> is your friend.
    >
    >
    >
    >Martin wrote:
    >> I trying to generate a table laid out like this:
    >>
    >> |----------|-----------------------------------------------|
    >> | | - - - - - Some Text Here - - - - - |
    >> |----------|-----------------------|-----------------------|
    >> | | And Here Too | And Here Three |
    >> |----------|-----------|-----------|-----------|-----------|
    >> | | ABC | DEF | | |
    >> |----------|-----------|-----------|-----------|-----------|
    >> | | | XSW | 123 | |
    >> |----------|-----------|-----------|-----------|-----------|
    >>
    >> That is, all of the columns being the same size with
    >> some columns having "headers".
    >>
    >> I would like to specify the overall width of the table
    >> to be a percentage and the columns to be a percentage of
    >> the table width.
    >>
    >> I'm using:
    >> <TABLE width="80%" cols=5>
    >>
    >> And then:
    >> <COLGROUP>
    >> <col width="20%">
    >> <col width="20%">
    >> <col width="20%">
    >> <col width="20%">
    >> <col width="20%">
    >> </COLGROUP>
    >>
    >> But, when I try to specify the various colspans,
    >> the width of the columns seems to revert to
    >> some kind of default (with the width depending
    >> on how much data is in the cell).
    >>
    >> <tr>
    >> <td>&nbsp;</td>
    >> <td colspan=4>- - - - - Some Text Here - - - - -</td>
    >> </tr>
    >>
    >> <tr>
    >> <td>&nbsp;</td>
    >> <td colspan=2>And Here Too</td>
    >> <td colspan=2>And Here Three</td>
    >> </tr>
    >>
    >> <tr>
    >> <td>&nbsp;</td>
    >> <td>ABC</td>
    >> <td>DEF</td>
    >> <td>&nbsp;</td>
    >> <td>&nbsp;</td>
    >> </tr>
    >>
    >> Can someone give me a clue as to what I'm doing wrong here?
    >>
    >> Thanks.
    >>
    >>
    Martin, Apr 9, 2005
    #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. =?Utf-8?B?QWxleCBNYWdoZW4=?=

    More Elegant Column Widths in ASP:Table Objects?

    =?Utf-8?B?QWxleCBNYWdoZW4=?=, May 14, 2004, in forum: ASP .Net
    Replies:
    1
    Views:
    552
    Jason DeFontes
    May 14, 2004
  2. savvy
    Replies:
    1
    Views:
    470
    savvy
    Jan 18, 2006
  3. vpravin
    Replies:
    5
    Views:
    427
  4. Replies:
    1
    Views:
    183
    Nathan Sokalski
    Apr 12, 2007
  5. jd
    Replies:
    2
    Views:
    111
    jdigital
    Dec 16, 2005
Loading...

Share This Page