How could this be?

[MaxS]

I'm making a very simple CSS page and I realized that it won't change to fit the person's resolution. I can't seem to figure out a way to fix this properly. I'd like to have the content box 35% from the top and the footer to be initially 75% away from the top but when the contentbox expands, I don't want it to overlap the footer? What could I do? I do realize I can make it so when it gets to a certain height it doesn't expand but it adds scrollbars. I'd rather not do that.

Thanks!

#contentbox
{
	position: relative;	
	top: 300px;
	margin: 0 auto;
	width: 25%;
	border-style: dotted;
	border-width: thin;

}

#footer
{
	position: relative;
	top: 65%;
	border-style: dotted;
	border-width: thin;
	min-width: 100%;
	text-align: center;
}

[codepoet]

Evil pixies in the garden are to blame. They are organised, I tell you!

Seriously though, the question to ask it: 75% of what?

the height of a document is initially the height of the content, not the browser viewport.

More on this:
http://www.quirksmode.org/css/100percheight.html
http://www.alistapart.com/articles/footers/

[MaxS]

Evil pixies in the garden are to blame. They are organised, I tell you!

Those fools!


I see. Thanks for filling me in! I'll see if there is any way to get around that.