我有一个使用Angular Material 2 mat-sidenav布局的布局，在mat-sidenav-content部分中使用了一个mat-tab布局。我正在尝试使mat-tab-labels处于粘性状态，以便它们始终可见，并且仍允许动态制表符内容滚动。通过在overflow: hidden上设置mat-sidenav-content，然后在overflow: scroll元素上设置mat-tab-body-wrapper，可以使标签保持固定，但是我必须设置一个固定的高度才能获得tab-content进行滚动，但是我有动态内容，因此不能选择固定高度。有没有办法在我不设置固定高度的情况下获取粘标签并滚动？
下面是一个演示。缩小窗口的垂直高度，直到它覆盖“大内容” div的一部分。它不会滚动。然后取消注释设置高度的mat-tab-group css，它将根据需要滚动（但固定高度）。
https://stackblitz.com/edit/angular-rty6oe?file=app%2Fsidenav-fixed-example.css
更新
好吧，@ Dakota Maker的答案解决了眼前的问题，也让我想起了我最初试图解决的问题，使我无法滚动。我更新了示例应用程序，以更好地反映我的真实应用程序。我在mata-tab-group上方的sidenav-content区域内有一个子标题，滚动时它永远不会到达底部，除非窗口高度足够大，因为标题似乎已经上下推了该内容屏幕。我可以在内容的底部添加一个边距以补偿子标题，但是子标题区域的高度可以更改。
如果我应该接受原始问题的答案并打开一个新问题，请提出建议。
答案 0 :(得分：1)
将height:100%设置为mat-tab-groups，您将可以滚动，并且大内容中间不会出现大白块
编辑随附OP的更新：
您可以在bottom:12px上添加.mat-tab-body-wrapper之类的内容，以在底部留出固定的空间。这最终将使您在包装程序顶部的一些溢出与制表符所在的位置有一些重叠，但是您应该能够解决这一问题，并在同一块中添加margin-top:12px之类的内容。希望这会有所帮助！