css - Angular Material Table水平溢出将列移出屏幕？

Question

我一直在努力让我的表格对移动设备/平板电脑更友好，并且我在文档中使用了 Angular Material 的表格示例和粘性列。

问题是当我水平滚动时，表格离开屏幕，无论如何都超出了粘性列，这是一个屏幕录像：https ://streamable.com/oesai——我在单元格来覆盖数据。

我已经将自己的类添加到标题单元格和表格单元格中，表格位于带有 CSS flex 的 div 内。如果我将溢出设置为 div 本身的自动/滚动，您将看不到它在粘性单元格后面滚动，但它仍然如此，您仍然无法访问该数据。

我目前的风格（SASS）：

.manage-users-table {
  .manage-users-table-cell {
    padding: 10px;
    font-weight: 500;
    font-size: 14px;
  }
  #name-cell {
    white-space: nowrap !important;
  }

  .manage-users-table-header {
    font-weight: 400;
    font-size: 14px;
    color: $DarkGrey;
  }
}

.mat-table {
  overflow: scroll;
}

nowrap 部分仅用于名称列。