Variable content div height using css with fixed header and footer

Question

I\'m having a bit of trouble with some CSS, and am seeking some help from this wonderful community.

I am trying to build a layout containing the following elements:<

Answer 1

Use a table or display: table-cell for content which has to have the same height.

[EDIT] A three column layout with a table is done in a couple of minutes and it works.

All those hacks using floating divs just create brittle layouts which sometimes work and sometimes fail. They are hard to debug, hard to get right and need a lot of CSS styles and HTML code. For little return. So if you want to waste a couple of days to get it to work, by all means use floating divs.

It's not my fault that someone said "tables are bad." It's like saying "the sun is bad because it burns you." Well, use it appropriately.