Problem with table cell width

Discussion in 'HTML' started by =?ISO-8859-1?Q?L=FCpher_Cypher?=, Mar 27, 2005.

  1. Hi,

    I have a table like this:

    <table cellspacing="0" cellpadding="0">
    <tr>
    <td style="padding:2px 4px 2px 4px;width:16px;">
    <img src="..." style="width:16px;height:16px;" />
    </td>
    <td style="padding:2px 4px 2px 4px;border-left:1px solid #000000;">
    Some text
    </td>
    </tr>
    <tr>
    <td colspan="2">
    Some text
    </td>
    </tr>
    </table>

    From the code above I expect a table with 2 cells in the first row,
    separated by a line, with the first one being 16px (or adjusted to fit
    the image), and the second one takeing the rest of the width of the table.
    Now, if I load that in Firefox/NS, it works fine, but in IE for some
    reason the first cell stretches more than needs to be. I could set
    table-layout:fixed and adjust width:20px, but then the table takes 100%
    of available width, and I need its width to be adjusted to content in
    the second row (if it's longer than the first row).
    Anyone has ideas how to fix it in IE?

    Thanks,
    Lüph
    =?ISO-8859-1?Q?L=FCpher_Cypher?=, Mar 27, 2005
    #1
    1. Advertising

  2. in alt.html, =?ISO-8859-1?Q?L=FCpher_Cypher?= wrote:
    > Hi,
    >
    > I have a table like this:


    Looks layout table. If it is not, give URL. Or if it is, and you want
    help, give URL.

    > but in IE for some reason the first cell stretches more than needs to be.


    Yes, why wouldn't it? That is explicitly allowed in CSS21, IIRC.

    > I could set table-layout:fixed and adjust width:20px, but then the table
    > takes 100% of available width,


    On IE, you mean...

    > and I need its width to be adjusted to content in the second row


    Yes.

    Easiest way to solve is not use table. If it is not layout table, give
    URL, and someone might find solution.

    --
    Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>
    Utrecht, NL.
    Lauri Raittila, Mar 28, 2005
    #2
    1. Advertising

  3. Lauri Raittila wrote:
    > in alt.html, =?ISO-8859-1?Q?L=FCpher_Cypher?= wrote:
    >
    >>Hi,
    >>
    >>I have a table like this:

    >
    >
    > Looks layout table. If it is not, give URL. Or if it is, and you want
    > help, give URL.


    Well, I'm doing everything on a local machine now. But basically, I'd
    like to have something that looks like a window: a title bar with an
    icon and a place to put the content in. The only thing is that I use
    icons 16x16px and want them to be separated by a vertical bar from the
    actual title:

    +--------+-------------...
    | [Icon] | Some title...
    +--------+-------------...
    | Some content...
    +----------------------...

    So, I naturally thought of a table. The thing is, that I don't always
    want to set table width. But I want the icon/title separator to be right
    after the icon (for which I can simply set border-right or border-left).
    So that's why I set the first cell's width:16px, but in IE it stretches
    more.

    >
    >
    >>but in IE for some reason the first cell stretches more than needs to be.

    >
    > Yes, why wouldn't it? That is explicitly allowed in CSS21, IIRC.


    Should it really, if I explicidly set its width?


    Lüph
    =?ISO-8859-1?Q?L=FCpher_Cypher?=, Mar 29, 2005
    #3
  4. =?ISO-8859-1?Q?L=FCpher_Cypher?=

    Toby Inkster Guest

    Lüpher Cypher wrote:

    > +--------+-------------...
    > | [Icon] | Some title...
    > +--------+-------------...
    > | Some content...
    > +----------------------...
    >
    > So, I naturally thought of a table.



    What about:

    <div class="story">
    <h2><img src="icon" alt="">
    Some title...</h2>
    <p>Some content</p>
    </div>

    ..story {
    border: 2px solid black;
    }
    ..story h2 {
    font-size: 133%;
    background: black;
    color: white;
    }
    ..story p {
    margin: 0.5em 1em;
    }

    --
    Toby A Inkster BSc (Hons) ARCS
    Contact Me ~ http://tobyinkster.co.uk/contact
    Toby Inkster, Mar 29, 2005
    #4
  5. in alt.html, =?ISO-8859-1?Q?L=FCpher_Cypher?= wrote:
    > Lauri Raittila wrote:
    > > in alt.html, =?ISO-8859-1?Q?L=FCpher_Cypher?= wrote:
    > >
    > >>Hi,
    > >>
    > >>I have a table like this:

    > >
    > >
    > > Looks layout table. If it is not, give URL. Or if it is, and you want
    > > help, give URL.

    >
    > Well, I'm doing everything on a local machine now. But basically, I'd
    > like to have something that looks like a window: a title bar with an
    > icon and a place to put the content in. The only thing is that I use
    > icons 16x16px and want them to be separated by a vertical bar from the
    > actual title:
    >
    > +--------+-------------...
    > | [Icon] | Some title...
    > +--------+-------------...
    > | Some content...
    > +----------------------...
    >
    > So, I naturally thought of a table.


    Why? it obviouly is not table...

    IMHO, this would be much more logical markup:

    <div><img><hN>title</hN>
    <p>Content
    </div>

    hN {display:inline;border-left:1px solid #000;}

    > The thing is, that I don't always want to set table width.


    So, don't set it.

    > But I want the icon/title separator to be right
    > after the icon (for which I can simply set border-right or border-left).


    Why can't you use border-left for title?

    > So that's why I set the first cell's width:16px, but in IE it stretches
    > more.


    As does NN4... And modern browsers as well on certain cases.

    > > Yes, why wouldn't it? That is explicitly allowed in CSS21, IIRC.

    >
    > Should it really, if I explicidly set its width?


    No, it there is no requirement of streching it, but it is allowed. Makes
    sence, as long as you use table for tabular data. Makes no sence on
    layout table, but that is pretty irrelevant...

    --
    Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>
    Utrecht, NL.
    Lauri Raittila, Mar 29, 2005
    #5
    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. AndrewF
    Replies:
    1
    Views:
    762
    Bruce Barker
    Oct 10, 2005
  2. Sean Jorden
    Replies:
    1
    Views:
    591
    laurie
    Aug 19, 2003
  3. Phillip Roncoroni
    Replies:
    14
    Views:
    1,086
    Toby A Inkster
    Apr 5, 2004
  4. Replies:
    0
    Views:
    512
  5. kaston3
    Replies:
    2
    Views:
    1,743
    kaston3
    Jul 18, 2006
Loading...

Share This Page