I'm trying to create the following trivially simple page layout.

A page header, full width, variable height depending on contents.

A content area. Full width, takes up the remaining vertical space in the browser window, scrolls vertically if content exceeds its size.

I don't care whether the solution uses tables, CSS or a mixture of the two, just no javascript please.

I've seen this question (or a variation of it) asked in a dozen places on the web, but no solution.

I can easily create a table where the cells take up the correct amounts of space. But cannot see a way to add content to a table cell in such a way that if the content is larger than the cell it scolls instead of expanding the table cell. I'd have thought this should be possible using an embedded div, perhaps the required syntax is just escaping me.

Using divs alone this would be possible if the header were fixed height, but I've not seen a solution to this problem using a variable height header.

Does anyone here know how to do this please?

7 Years
Discussion Span
Last Post by macneato
This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.