Internet Explorer 6 bug?

[Tonearm]

I noticed a problem with my site in IE6 and reduced it to the following:

<table cellpadding="0" cellspacing="0" border="1" width="100%">
<tr>
<td colspan="3">aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</td>
</tr>
<tr>
<td width="150">a</td>
<td>a</td>
<td width="150">a</td>
</tr>
</table>

This doesn't display properly in Internet Explorer 6.0.2800.1106 (latest), but does in Konqueror 3.1. If you take away one of the "a" characters from the long string of them (to make 36 instead of 37) the problem goes away. Is this a bug?

- Grant

[msr986]

What is it you are seeing?

When I post your code into my browser, everything works fine!

[Tonearm]

When I use 37 "a" characters in the long string, the left and right cells expand way beyond 150 pixels, and the middle cell shrinks. When I use 36 characters, everything looks as it should. Nobody else is seeing this?

- Grant

[Farix]

Declair a width of 100% for that cell and see if that fixes the problem.

[SuzyUK]

Yes it's there though I'm not sure if it's actually a "bug".

It's not related to exactly how many characters you say.. try changing it to a 'm' or change the font-size. It's directly related to the width of that first cell, once there are enough characters to make the width more than 300px (2 x 150px) then the center column seems unable to do it's maths :o

I've read very little on this "bug" and can't find any authority resources on it now (I did find a couple of links but if I remember they were just pointing out the bug..), it is commonly triggered in two column layouts.

I presume it's more related to how IE renders tables, the algorithm for table layout is somewhat up to the browser..17.5.2 Table width algorithms: [w3.org]. On reading this it seems that just using a fixed table-layout should correct it, however in a test it didn't. This is maybe more "correct" on IE's behalf as it's using one "pass", the first row has to render before the table knows about any width constraints which are set in row #2...

But then IE does have support for colgroups and the use of them with a fixed table layout does seem to help in this case, I'm a little rusty with the use of layout tables ;) but the code below seems to correct your above example, maybe because you are stating the column widths first (in the colgroup delaration) so the table knows before it starts to render? - It's too early for maths so I'll just put some code and you can check to see if it works in your real world case?

<table cellpadding="0" cellspacing="0" border="1" width="100%" style="table-layout: fixed;">
<colgroup>
<col width="150" />
<col width="*" />
<col width="150" />
</colgroup>
<tr>
<td colspan="3">aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</td>
</tr>
<tr>
<td>a</td>
<td>a</td>
<td>a</td>
</tr>
</table>

hth
Suzy

[Tonearm]

Suzy - Thank you very much. I added this and it does fix the problem:

<colgroup>
<col width="150" />
<col />
<col width="150" />
</colgroup>

I plan on switching away from tables soon, but this will do for now.