fluent-ui - 如何冻结 Fluent UI 详细信息列表中的第一列

Question

如何仅冻结 Fluent UI 详细信息列表中的第一列？列数超过 40 。因此需要冻结，以便可以使用水平滚动。

Answer 1

没有直接的方法。但是你可以用一些 css hack 来做到这一点。这几乎是不言自明的。

.ms-DetailsRow-cell:first-child, .ms-DetailsHeader-cell:first-child {
  position: sticky;
  inset: 0;  
  background-color: white;
  z-index: 1;
}