If this is your first visit, be sure to
check out the FAQ by clicking the
link above. You may have to register
before you can post: click the register link above to proceed. To start viewing messages,
select the forum that you want to visit from the selection below.

The height property has effect only on block-level elements or on elements with absolute or fixed position. The overflowing content can be manipulated with the overflow property.

A div is a block level element. The height attribute does apply.

Also why are you referencing JavaScript page inside of CSS? That link has nothing to do with css and shouldn't be used as a reference as to why something in css isnt working. Thats like saying take a look at how this applies in PHP while you are trying to solve a C# problem. Not trying to be mean but thats basically the equivalence.

Last edited by PBSWebDesign; 04-21-2012 at 06:47 PM.

----------------------------------------------------------------------------------------------
WYSIWYG editors will never beat my hand written code!!!! Learn to do it in notepad and learn how to actually control your website! Current Project http://www.jmcanineservices.com

In order for this to work the wrapper itself needs to have a set height. Not in percentages but in px's. So set it to something like 800 and then you can use the min-height: property to get the desired result. Without the wrapper having a set height in tangible numbers then the child elements such as your div's will be trying to scale to 30&#37; of nothing because there is no number set to it. With it being set to a defined height in numbers it can effectively be set to be 20% and 80% of the parent element in this case the wrapper.

So set the min-height of the wrapper so that if you go over that height that is fine it will just keep expanding and then set the divs with min height as well just in case you go over what you are wanting.

Last edited by PBSWebDesign; 04-21-2012 at 07:00 PM.

----------------------------------------------------------------------------------------------
WYSIWYG editors will never beat my hand written code!!!! Learn to do it in notepad and learn how to actually control your website! Current Project http://www.jmcanineservices.com

Setting 'min-height' is not the same as setting 'height'. Without setting 'height' on #wrap, your internal <div>s don't have a reference for setting their own height as a percentage. I also changed #bottom to 20% so that the total of the two was 100%. While you can use 30%, it makes the document exceed the size of the browser window and I'm not sure that's what you wanted.