CSS Forum

**Miki** · 07-06-2006, 04:37 PM

Hello, long-time no-see.

Anyway, I was wondering, is it possible to make a div 100% of the browser height?

I tryed 100%, min-height. I've tryed searching on google but 99.9% of the things I find is just vertical div alignment.

For example, I have a page at the moment, a very simple page. There is a header div thats 75% of the page width and next to it is supposed to be a "sidebar" type thing that would look very nice at 100% of the page height.

I've tryed setting the div to 600px, but one size doesnt fit all unfortunatly.

Thank you in advance for any replies and talkupation will be given to those with helpful answers.

**waffles** · 07-06-2006, 05:49 PM

Set your body height to 100%. From everything I've read, the div height works off of what it's inside and not the browser height.

Example

**LadynRed** · 07-06-2006, 05:58 PM

First of all, min-height is just that.. minimum and it doesn't work.
This obsession with having to fill the viewport escapes me, but all newbies seem to want to do it.

http://css-discuss.incutio.com/?page...dPercentHeight

**kIDJOE** · 09:10 PM

Quote:

...fill the viewport escapes me, but all newbies seem to want to do it.

Everyone has the right to be willing to make a div 100% height. If you need to develop certain functionality LadynRed, like covering an entire application with a transparent layer while background processes run to avoid the end user to click on, or to cover text to avoid its reproduction, or any server-side level you may need a wait.... Even Plesk uses this type of layers for their web server control panel software and I don't consider Plesk a newby.

and YES you can set a DIV to 100% height if its container has been set to a 100% height as well, if the very <body> is containing your DIV you can just set the Body style to 100% height.

**waffles** · 07-06-2006, 11:09 PM

The look of frames maybe. Maybe other reasons. Here's an idea, maybe I don't want my content to spread out and fill the area under the navigation. It happens, so don't make him feel bad about asking a question.

**kIDJOE** · 07-06-2006, 11:26 PM

Thats what Im saying

**ADAM Web Design** · 07-06-2006, 11:49 PM

Actually, that argument doesn't really apply with Plesk or the height. If background processes need to run, a redirect once done will accomplish that purpose.

If you want the background to fill the viewport, then add it as a body attribute. The content itself should be resizeable.

So there really isn't a reason to do it.

Miki: what are you trying to accompish?

**LadynRed** · 07-07-2006, 10:53 AM

I wasn't trying to make anyone feel bad, I gave him the solution didn't I ????
It IS a common question among newbies... I've seen it a million times.

**kIDJOE** · 07-07-2006, 03:08 PM

my Plesk theme SHows a DIV while trying to run processes and hides it when done, anyway thats not what Miki needs, the question was how to set a DIV's Height to 100%. thats all and its doable

**ADAM Web Design** · 07-07-2006, 04:41 PM

But is it pure CSS or CSS and Javascript? It sounds like a combination of both, which would allow for a div (or any other element) to be resized to fit the entire viewport.

**kIDJOE** · 05:10 PM

no man... you CAN really set a div's height to a 100% and of course the show and hide is Javascript. that's anyway out of this thread.