How to force child div to be 100% of parent div's height without specifying parent's height?

Question

I have a site with the following structure:

  

  <         


        
      

Answer 1

#main {
   display: table;
} 
#navigation, #content {
   display: table-cell;
}

Look at this example.