Damn, damn, damn, I hate IE6...

I finally found a way of doing the classic Slashdot style header, 3 columns, footer without tables and just with CSS. The gist is a sequence of header, left sidebar, right sidebar, content, footer. Each element has an ID. The sidebars use Float left and right, and the footer uses clear:both.

So it all works nicely in Firefox and appears to work in IE. Until there's substantial content and then IE starts rendering the content half way down the page. It turns out that the nasty kludge is to wrap the content in a dummy table. It seems that IE can work out that you can't fully render a table until the final table close, but it can't work out the same thing for a div.

Anyway, another hint that might help someone. If you define a column in IE and then embed a table with width 100%, it uses 100% of available space, not 100% of the column. The kludge here is to wrap the table in a div with width 100%. And the style info has to be in the html not in the CSS stylesheet eg <div style="width:100%">

Then there's remote Javascript content like the thumbnails of My Ecademy network on the right. IE only renders this about 1 time in 3. Firefox renders it every time.

Damn I'm sick of IE's CSS bugs. As one person recently said, 5 days to do the UI in Firefox. 5 weeks to make the UI work in IE as well.

[ << Regular Sucking Schedule ] [ Google replies >> ]
[ 12-Dec-04 7:57pm ] [ , , ]