使子div自动垂直填充以及溢出其内容

Question

<div class="container">
  <div class="header"> header </div>
  <div class="content"> {expanding content} </div>
  <div class="footer"> footer </div>
</div>

让我们说我将页眉和页脚固定为50px，如何让中间内容自动填充剩余高度并溢出其内容？