如何嵌套*位置：粘贴*垫扩展面板内部=>；css网格

在手风琴的内部，我有一个网格，有两列（实际上更多，但为了简单起见）可变长度（动态表单创建者）。在左栏中，我有一些按钮，当向下滚动右栏时，我想留在屏幕上。css网格或扩展面板是否与Stick相矛盾？我试图发现溢出被隐藏，因为我读到你不能这样做，但我没有发现。你知道我错过了什么，为什么我的粘液不留了吗

.html

有溢出：隐藏；您可以通过移除粘滞位置来固定粘滞位置，如下所示：

.mat-expansion-panel {
 overflow: inherit !important;
}

---

但如果任何面板折叠，则会导致面板后出现空白。关于这个css问题的更多信息：

我遇到了这样一种情况：当您滚动时，我需要扩展的

mat扩展面板标题

粘贴到页面顶部

@Mateusz Budzisz的回答谈到了使用

overflow:inherit！重要信息

位于

.mat扩展面板

上，但这会使页面留下大量的空白空间和因扩展面板主体溢出（但高度：0'd）而产生的滚动条

我通过添加以下规则解决了此问题：

.mat-expansion-panel {
    overflow: inherit !important;
}

.mat-expansion-panel-body {
    overflow: hidden; // This rule fixes extra whitespace
}

.mat-expansion-panel-header.mat-expanded {
    position: sticky;
    top: 0;
    z-index: 1000;
}

现在，所有展开的面板标题都会像它们应该的那样贴在页面顶部，当面板关闭时，没有空白

我最初尝试添加

溢出：隐藏

规则仅适用于

.mat扩展面板内容

，但这使得面板的扩展/关闭动画行为怪异

.mat-expansion-panel {
 overflow: inherit !important;
}

.mat-expansion-panel {
    overflow: inherit !important;
}

.mat-expansion-panel-body {
    overflow: hidden; // This rule fixes extra whitespace
}

.mat-expansion-panel-header.mat-expanded {
    position: sticky;
    top: 0;
    z-index: 1000;
}