DIV固定高度,不考虑内部元素

出于报告目的,我需要一个DIV report-canvas 固定高度 mm :

.report-canvas {
    height: 335mm;
    min-height: 335mm;
    max-height: 335mm;
}

页面具有以下结构:

  <div class="a4">
    <div class="header"></div>
    <div class="report-canvas"></div>
    <div class="footer"></div>
  </div>

当 .report-canvas 没有任何子元素。但当我开始添加 h2 的, table S等 div ,然后将页脚向下推到页面外, 报表画布 太大了。我怎样才能强迫 报表画布 不管子元素是什么,总是有相同的大小?

这是其他元素的CSS:

.a4 {
    page-break-before:always;
    clear: both;
    margin: 0 auto;
    border: 1px solid #888888;
    width: 250mm;
    height: 365mm;
  }
.header {
    padding-bottom: 10px;
    height: 35px;
  }
.footer {
    padding-top: 10px;
    height: 25px;
  }