如何给角材料表赋予固定高度

Question

我有一个angular material table(10 rows)，我想将其高度固定为300px（应使用垂直滚动查看多余的行）。当我将样式的高度赋予300px时，它没有任何作用。 该表的内容超出了给定的高度。

查看图片链接。

我想在两个表之间一个接一个，并且我希望它们等于height 50%.，第一个表本身占去10 rows height。

Angular Material Table

Answer 1

我在类中使用了包装器div

<div class="table-container">
   <table mat-table [dataSource]=.....>
   </table>
</div>

这是课程

.table-container {
  margin-top: 10px;
  max-height: 300px;
  overflow: auto;
}

Answer 2

在CSS文件中尝试一下

table tr.mat-row {
  height: 300px;
}