IE6 Bug? Table wraps

#1

Hello ciwas world. I've just found this newsgroup, and it looks really
useful.

I've put an example of some really irritating IE6 behaviour at:

http://www.devany.com/example.html

This is a header/navbar/content layout that shows how a table in the
content area will be strangely wrapped by IE.

Starting from a regular sized window, reduce the width of the page. At
the point at which you would expect the browser to stop resizing the
table, the table will be wrapped to below the height of the navbar diff.

Also, if the page height is less than the height of the navbar div, the
content div will be rendered incorrectly.

This is so f'd up, I'm certain someone else must have seen it and can
make a workaround suggestion.

Any takers?

--

John Robin Devany
http://www.devany.com

#2

John Robin Devany wrote:

Quote:

Hello ciwas world. I've just found this newsgroup, and it looks really
useful.

I've put an example of some really irritating IE6 behaviour at:

http://www.devany.com/example.html

This is a header/navbar/content layout that shows how a table in the
content area will be strangely wrapped by IE.

Starting from a regular sized window, reduce the width of the page. At
the point at which you would expect the browser to stop resizing the
table, the table will be wrapped to below the height of the navbar
diff.

Also, if the page height is less than the height of the navbar div,
the content div will be rendered incorrectly.

This is so f'd up, I'm certain someone else must have seen it and can
make a workaround suggestion.

If it's inelegant and crude you're looking for, try adding the following as
an extra row in the table with a suitable width at *
<tr>
<td colspan="6"><img src="transparent.gif" width="*" height="1"></td>
</tr>

--
PeterMcC
If you feel that any of the above is incorrect,
inappropriate or offensive in any way,
please ignore it and accept my apologies.

#3

PeterMcC wrote:

Quote:

John Robin Devany wrote:

Hello ciwas world. I've just found this newsgroup, and it looks really
useful.

I've put an example of some really irritating IE6 behaviour at:

http://www.devany.com/example.html

Snip

If it's inelegant and crude you're looking for, try adding the following as
an extra row in the table with a suitable width at *
tr
td colspan="6"><img src="transparent.gif" width="*" height="1"></td
/tr

Thanks, but I need something which will work without hacking-up the HTML.

--

John Robin Devany
http://www.devany.com

#4

"PeterMcC" <peter (AT) mccourt (DOT) org.uk> wrote

Quote:

If it's inelegant and crude you're looking for, try adding the following
as
an extra row in the table with a suitable width at *
tr
td colspan="6"><img src="transparent.gif" width="*" height="1"></td
/tr

I tried your idea of the transparent gif. It doesn't solve the problem. You

would think that a crude method such as this could not fail, but, as I say
it makes no difference.

http://p0c79.phpwebhosting.com/~p0c79/example.html

Any more ideas?
BTW - I'm working my way through the first chapter of 'Eric Meyer on CSS'
and I notice that his first project on converting a table layout to CSS only
goes as far as presentational changes, the major layout tables are left in
place. Perhaps, it will be another few years before CSS for layout will be a
viable option considering all the cross browser issues of today.
Disappointing to see IE6 (which is the most standards conforming browser
from MS) having a problem with such a simple layout.
bye
David
David Graham

#5

John Robin Devany wrote:

Quote:

Hello ciwas world. I've just found this newsgroup, and it looks really
useful.

I've put an example of some really irritating IE6 behaviour at:

http://www.devany.com/example.html

This is a header/navbar/content layout that shows how a table in the
content area will be strangely wrapped by IE.

Starting from a regular sized window, reduce the width of the page. At
the point at which you would expect the browser to stop resizing the
table, the table will be wrapped to below the height of the navbar diff.

Also, if the page height is less than the height of the navbar div, the
content div will be rendered incorrectly.

This is so f'd up, I'm certain someone else must have seen it and can
make a workaround suggestion.

Any takers?

table {
table-layout: fixed;
}

fixes it!

Tx to all who looked at it.
--

John Robin Devany
http://www.devany.com

#6

Quote:

table {
table-layout: fixed;
}

fixes it!

The only problem is that IE6 then makes the table stretch the full width of

the div that contains it. Mozilla and Opera allow the table to shrink wrap
around the tables content, which is the normal behaviour for a table

David

#7

David Graham wrote:

Quote:

table {
table-layout: fixed;
}

fixes it!

The only problem is that IE6 then makes the table stretch the full width of
the div that contains it. Mozilla and Opera allow the table to shrink wrap
around the tables content, which is the normal behaviour for a table

Quite right, I should really describe it as a work-around.

--

John Robin Devany
http://www.devany.com

#8

In article <bm63rk$dpd$1 (AT) hercules (DOT) btinternet.com>,
John Robin Devany <firstname (AT) lastname (DOT) com> wrote:

Quote:

Hello ciwas world. I've just found this newsgroup, and it looks really
useful.

I've put an example of some really irritating IE6 behaviour at:

http://www.devany.com/example.html

This is a header/navbar/content layout that shows how a table in the
content area will be strangely wrapped by IE.

Starting from a regular sized window, reduce the width of the page. At
the point at which you would expect the browser to stop resizing the
table, the table will be wrapped to below the height of the navbar diff.

Also, if the page height is less than the height of the navbar div, the
content div will be rendered incorrectly.

This is so f'd up, I'm certain someone else must have seen it and can
make a workaround suggestion.

This is the 3px jog bug.

http://www.positioniseverything.net/...reepxtest.html

You could try 'position: absolute' with a suitable 'left' instead of
'float: left'.

nhoJ
--
John P Baker

#9

JP. Baker wrote:

Quote:

In article <bm63rk$dpd$1 (AT) hercules (DOT) btinternet.com>,
John Robin Devany <firstname (AT) lastname (DOT) com> wrote:

I've put an example of some really irritating IE6 behaviour at:

http://www.devany.com/example.html

This is the 3px jog bug.

http://www.positioniseverything.net/...reepxtest.html

You could try 'position: absolute' with a suitable 'left' instead of
'float: left'.

nhoJ

Indeed it is, thanks for the link.

--

John Robin Devany
http://www.devany.com

#10

In article <bm6oqj$fpg$1 (AT) sparta (DOT) btinternet.com>,
John Robin Devany <firstname (AT) lastname (DOT) com> wrote:

Quote:

JP. Baker wrote:

This is the 3px jog bug.

http://www.positioniseverything.net/...reepxtest.html

Indeed it is, thanks for the link.

I have gained great familiarity with it over the last fortnight.

November 2002. Implemented 'transitional' design for university site.
(table top and bottom for backward compatibility, div navigation and
content). Noticed occasional misplaced bullets in lists put it down
to IE error with custom bullets. Most pages were placeholders at the
time so were shorter than navigation.
Christmas 2002-March 2003. Broke my ankle. My boss seemed more concerned
at the jog problem than my health. Of course there was real content now.
April 2003. went live with site, deciding that a few pixels were IE's
problem and we would have to lump it.
June 2003-October 2003. Released template to other departments. Some of
whom had pages that were just tables (AAAAARGH).
October 2003. Identified as 3px jog (float) bug. Tried to find any fix
that wouldn't cause a regression. (Unfortunately we have a footer so
can't just go to 'position: absolute'. Cosmetic patch, temporarily put
in on Monday, equivalent of:



Which needs JScript and, due to another bug, doesn't get saved to disc.
(at least the other browsers only see a comment)
Now. No idea how to redeem the situation.

[ links off http://www.bris.ac.uk/ ]

nhoJ
--
John P Baker