how to make angular table with sticky header stick to an offset-CodePudding

I have the following working example of an angular table with a sticky header:

My question is: how to prevent the table from going all the way up to the top, when scrolling, but stop at an offset. I've tried something like:

table {
  width: 100%;
  position: sticky;
  top: 30px;
}

But that wouldn't work.

CodePudding user response：

If I correct understand your question - you could just override top property for .mat-table-sticky class:

::ng-deep .mat-table-sticky {
  top: 30px !important;
}