Reply To: CSS Height by percentage

[paulob]

Tables require a lot more CSS syntax

They only need the one line I posted in my last post but min-height would also work as you suggest as long as you don’t nest the min-height element or you will lose the height.

However, both yours and my suggestions are flawed because should you add more content into one of the areas then the whole thing stretches past the viewport bottom edge when there is no need for it to do so.

A better approach (assuming this was the OPs idea) is to use a complete CSS table structure and allow areas to grow while not forcing the content below the fold when its not required. It’s more mark up but ultimately more reliable.

e.g.
http://www.codepen.io/paulobrien/full/JjtnH

Of course that assumes that I have understood the requirements properly – which may not be the case :)