[KrisMarissens]

Hi there,

Can someone help me in finding the best way to set the pages to 100% height, while maintaining the 760 px width?

Would i have to add another div set to 100% height inside the wrapper/container div? I suppose mixing pixels and % in the same class doesn't work in CSS...

Thanks in advance.

http://www.cmstest2.be

[finbarr]

mixing % and pixels is not the problem... perfectly acceptable practice.

your page doesnt load for me so cant see what youre getting at

[KrisMarissens]

Originally Posted by finbarr

mixing % and pixels is not the problem... perfectly acceptable practice.

your page doesnt load for me so cant see what youre getting at

Maybe i oughta check my typing now and then...

The url in url tag wasn't the correct one

Here is the correct one: http://www.cmstest2.be

[finbarr]

so you want the page to stretch to the bottom of the screen?

If so do a search for 'css faux column technique' on google... give you plenty of tutorails on the subject

ps: your css is frightening... impossible to search for details relating to your subject.

[Red Cap]

not sure what youre getting at, but if you want the background of your container to stretch the height of the window, you could try taking a horizontal slice of the bg and repeating it vertcally like;

body {
background-image: url{../images/bg_slice.gif};
background-position: top center;
background-repeat: reapeat-y;
}

[i3lance]

make sure that your body and html have 100% within its properties also. Everything else contained within them ultimately are controlled by the body and html properties.

That's what works for me.

[Red Cap]

^^^ thats an eg. of faux columns thanks finbarr

the body tag is always 100% of the vertical height

also have a look at 'css rollovers' for your buttons

[finbarr]

Originally Posted by Red Cap

^^^ thats an eg. of faux columns thanks finbarr

the body tag is always 100% of the vertical height

haha... thats fine RC

[KrisMarissens]

Originally Posted by finbarr

ps: your css is frightening... impossible to search for details relating to your subject.

I'll have to put some proper structure into it...

[KrisMarissens]

Originally Posted by Red Cap

^^^ thats an eg. of faux columns thanks finbarr

the body tag is always 100% of the vertical height

also have a look at 'css rollovers' for your buttons

Path to .js preloader now corrected. Thanks for pointing that out!

[pgo]

Originally Posted by Red Cap

body {
background-image: url{../images/bg_slice.gif};
background-position: top center;
background-repeat: reapeat-y;
}

Better yet:

body { background: url(../images/bg-image.gif) repeat-y top center #color; }

[KrisMarissens]

The trouble is that i would like for the blue and gray background (table cells) to follow down also, and i'm kind of fond of that little white border surrounding the whole.

so that pretty much rules out the background repeat attribute i'm affraid...

[pgo]

No...that's exactly what background repeat is for. Google "faux columns css" and you'll find your answer.

[Red Cap]

Originally Posted by pgo

Better yet:

body { background: url(../images/bg-image.gif) repeat-y top center #color; }

didnt want to throw shorthand at a newbie

[KrisMarissens]

Originally Posted by pgo

No...that's exactly what background repeat is for. Google "faux columns css" and you'll find your answer.

Not really. Correct me if i'm wrong, but the thing is: i want to add a little white border at the top, left side, right side AND BOTTOM of the box, this makes the repeating background unfit as a possible solution .

If it weren't for the white line, i would indeed only be needing this - imho wouldbe - solution...

Cheers.

[KrisMarissens]

Or maybe i'll just add that extra div with the repeating background and change the table into floating divs. That will do the trick.

Thanks all.

[finbarr]

remember to post back the end result, wont you?

[Red Cap]

hes already put it up finbarr http://www.cmstest2.be/

[finbarr]

Originally Posted by Red Cap

hes already put it up finbarr http://www.cmstest2.be/

hmmm... do I feel sheepish

[KrisMarissens]

So anyway, i went with the the repeating background image in the body element and ditched the top and bottom white border...
This is indeed the fastest solution (in a band-aid-like sense).

Thanks very much.