Take a look at these pages:

http://deimos.curious.be/~dusk/test/index.html
http://deimos.curious.be/~dusk/test/index2.html

They are the exact same code except for the doctype, which isn't
included in the index2.html file so it renders in "quirks" mode.

However, the way it renders in "quirks" mode is (almost) exactly how I
expected the page to render. I want the overflow scrollbar on the
"main" div (overflow set to auto) when the content becomes too large,
and I want the body to be 95% of the viewport (height set to 95%).

So what do I need to change in order to render the page as it renders
in "quirks" mode, but with the "strict" doctype?

Additional question: is this css layout ok to start with or will I run
into problems once I'll be adding content in the "main" div? I know
it's totally broken on IE due to the fixed elements, but I don't care
to much about that at the moment.

Greets
Tommy

TomB wrote:

Take a look at these pages:
>
http://deimos.curious.be/~dusk/test/index.html
http://deimos.curious.be/~dusk/test/index2.html
>
They are the exact same code except for the doctype, which isn't
included in the index2.html file so it renders in "quirks" mode.
>
However, the way it renders in "quirks" mode is (almost) exactly how I
expected the page to render. I want the overflow scrollbar on the
"main" div (overflow set to auto) when the content becomes too large,
and I want the body to be 95% of the viewport (height set to 95%).
>
So what do I need to change in order to render the page as it renders
in "quirks" mode, but with the "strict" doctype?

html, body { height: 100% }

makes it fill the viewport, as it does for quirks mode.
(body does it for ie, html does it for everything else, iirc)

Chris

Chris Sharman schreef:

TomB wrote:

>
html, body { height: 100% }
>
makes it fill the viewport, as it does for quirks mode.
(body does it for ie, html does it for everything else, iirc)
>
Chris

Ah, okay. That got me somewhere. I had to change some other stuff to
get this to work, but I'm very pleased with the result so far.

There's one thing that bugs me a little. With a browser window of
800*600 the footer text clips the viewport. I specified a margin of 2em
for the "foot" div, but it seems to be ignored for some reason. Any
hints?

Another problem is that with extreme small viewports the footer text
will clip the navigation div. I don't really care to much for that (are
there folks out there that go below let's say 500*500?) but if someone
knows a remedy I'd be glad to know :-)

Any comments on the overall look/feel?

TIA
Tommy