角形材料垫抽屉与高度的问题

Roj*_*Roj 6 html javascript css angular-material angular

由于某种原因,我似乎无法让垫子抽屉占据屏幕上剩余的可用高度。我试过了:

.drawer-container {
    position: fixed;
    height: 100%;
    min-height: 100%;
    width: 100%;
    min-width: 100%;
}
Run Code Online (Sandbox Code Playgroud)

但由于某种原因,即使屏幕上只有一个元素(如滚动条所示),我仍然会出现溢出:

在此输入图像描述

当我删除 CSS 规则时,我最终得到以下结果:

在此输入图像描述

基本上只占屏幕高度的10%左右。我考虑过使用固定高度,但我猜如果在更大或更小的显示器上观看,它看起来会被切断。我将不胜感激任何帮助,因为我真的不熟悉有角材料的全部属性以及如何正确操纵它们。提前致谢。

Roj*_*Roj 1

万一有人掉线并遇到类似的问题。我很久以前就通过申请解决了这个问题

.drawer-container {
  position: absolute;
  top:0;
  width: 100%;
  bottom: 0;
}
Run Code Online (Sandbox Code Playgroud)

只需确保父母有position: relative