Problem with table cell width

[=?ISO-8859-1?Q?L=FCpher_Cypher?=]

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

 

[Lauri Raittila]

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.

 

[=?ISO-8859-1?Q?L=FCpher_Cypher?=]

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.

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

Should it really, if I explicidly set its width?


Lüph

 

[Toby Inkster]

+--------+-------------...
| [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;
}

 

[Lauri Raittila]

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.

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...