Css 如何在mat sidenav内容中使可切换的mat sidenav推送也成为固定标题

我正在使用mat sidenav容器创建我的页面的桌面版本，但我想使mat sidenav可切换，这是我已经设法做到的。 现在的问题是，我在mat sidenav内容上有一个固定的标题，当mat sidenav显示时，该部分没有被推送

对于mat sidenav内容，我使用css网格将此部分分为两部分（固定标题和主要内容）

给你

你知道我怎样才能让垫子侧边的导航同时推动固定的头球吗

---

谢谢。

您必须从.content\u标题中删除这些样式：

并向其添加

位置：sticky

。由于

位置：固定

，侧边栏无法将块推到一侧，并且由于固定高度，在移除

位置：固定

时，块溢出。高度特别不需要，因为您已经在.content类中使用以下命令指定了它：

网格模板行：12rem auto。将其更改为
位置：sticky
使标题仍在滚动中，但也会被推到一边。重要的是，
top:0
仍然存在

.content\uu头类现在应该如下所示：

.content__header {
  background-color: #eee;
  width: 100%;
  position: sticky;
  top: 0;
  padding: 0.5rem 1rem;
  z-index: 3;
}

.content__header {
  background-color: #eee;
  width: 100%;
  position: sticky;
  top: 0;
  padding: 0.5rem 1rem;
  z-index: 3;
}