如果页面还具有垫子扩展面板，并且如果记录溢出，则表应显示滚动条，如何设置垫子表的高度

Question

我的页面上有一个扩展面板，一个垫子桌子和一个分页器。扩展面板位于页面顶部，分页器位于页面底部。表格应填充扩展面板和分页器之间的剩余空间，并且如果记录溢出，表格应具有垂直滚动条。我该如何设置？

当页眉和页脚为静态高度时，就可以毫无问题地将表格高度设置为百分比。但是，由于扩展面板可以有2种尺寸（扩展和折叠），所以我不确定将表部分的高度设置为什么，以使其在超出页面范围时溢出。我尝试将桌子的高度设置为自动。但是那里没有运气。

.exp-panel {
  min-height: 10%;
  max-height: 30%
}

table-section {
  height: auto;
  overflow-y: auto;
}

footer-section {
  position: absolute;
  bottom: 0;
  max-height: 5%;
  height: 30px;
}


<div class="exp-panel">
  <mat-accordion>
    <mat-expansion-panel>...</mat-expansion-panel>
  </mat-accordion>
</div>
<div class="table-section">
  <mat-table>...</mat-table>
</div>
<div class="footer-section">
  <mat-paginator>...</mat-paginator>
</div>

实际结果- 设置了exp-panel和footer的高度。但是表从页面溢出，并且没有滚动条可见，无法看到溢出部分隐藏的行。

预期- 如果记录溢出，表部分应具有高度，滚动条应可见。