100% Height of Container

Automatically Scaling Height

[bachya]

Hi everyone,

I have a page where the main container (container #1) (in which all my content goes) has a height of 100% of the body. I have another container (container #2) inside the main one - it's been moved down the page a certain amount by using margins.

Here's my problem: I want container #2 to have a height that is 100% of container 1, regardless of how tall container #1 is. I tried just assigning a height of 100% to container #2, but since it has been shifted downward using margins, it overextends container #1. Any ideas of how I can rectify this?

Thank you sincerely for your help.

[DrDoc]

For now, the best way of solving something like this is to simply use wrappers. Apply margin/padding to the outer element, height/width to the inner.

[bachya]

I'm slightly confused as to how exactly I would do this. Also, would this method accomodate for the fact that some content would extend the inner container more so than other content?

[bachya]

Never mind - I think I've got it. It's unfortunate that there's no concrete methods to do this. Oh well, it works. :D

Thanks for your help. I'll return if I need more assistance.