Problem with IE in Strict mode(works fine without the doctype aka in QuirksMode)

[SuperBlue]

I have uploaded a test version of my new website at brugbart.dk, this is more liquid then any past layout i've made. And its very satisfying, even thoug its not perfect. Im happy to be able to have a "graphical layout" that change size as the user change font size.

 

Bear in mind that the top, and bottom "bars" or whatever, are only place holders. Aswell as the grapic in the Menus. I think it would really look nice with animated Skys at the top, and perhaps the same, or sea at the bottom.

 

 

 

Anyway, the problem im encountering can be solved by simply leaving out, or commenting out the Doctype in IE, i can have PHP do this, so maybe its no major problem. What would you css veterans advice me to do?

Try to change font size to "biggest" using IE, and watch how it create "holes" below the menus, try to do the same in FF.

I think, (if i remember correctly from my testing) that it will do the same in IE alone if the content of the CenterContent gets to big.

 

Do things differently, so it works in both browsers?. Well i've tryed almost everything in my hunt for the 3 column layout, now i got it working in FF by using display: table;, i just hope its not working due to a "bug". With this fiddling in the dark, you just never know  ???

 

I think, i'll just comment out the doctype in IE, and explain why i've done it in the source... Why oh why isent there just The One magic css declaration witch solve my problem. 

I've allready spend to moch time on this, thanks to IEs broken support i assume, (i used to like IE  :'().

 

[dustinnoe]

<a href="http://alistapart.com/articles/holygrail">This tutorial</a> explains how I approach three column layouts. It has worked well for me concerning cross-browser compatibility.

 

http://alistapart.com/articles/holygrail

[SuperBlue]

<a href="http://alistapart.com/articles/holygrail">This tutorial</a> explains how I approach three column layouts. It has worked well for me concerning cross-browser compatibility.

 

http://alistapart.com/articles/holygrail

 

I've allready readen alot of "holy grail" articles on the matter, but im not happy with the result.

In this case the flickering of the left menu when you change the size of the browser window, and the overlapping issiue when the window becomes to small, not to mention no min-width. Perhaps that would be easy to fix?

anyway, both the left and the right menu dosent scratch to the bottom togetter with the center column, and thats one of the main things im trying to achive.

 

Thanks for shareing thoug 

[bronzemonkey]

Have you seen Stu Nicholls' solution to the 3 column layout? Very simple and appearance of all columns being the same height

 

http://www.cssplay.co.uk/layouts/3cols.html

 

http://www.cssplay.co.uk/layouts/3cols2.html

 

You could probably adapt them very easily to meet your extra requirements