Gutter does not show up inside mat-card using Angular Material UI

[PeterSR]

There seems to be a weird interaction between Angular Material and angular-split.
When I try to put a split¹ inside a mat-card, the gutter does not render and is not draggable.

Even outside the the card, there seems to be some weird behavior, requiring a height on the container. See the stackblitz below.
Perhaps I have missed something in the documentation?

To Reproduce

https://stackblitz.com/edit/angular-material-components-demo-bxezvy?file=src/app/app.component.html

The stackblitz uses Angular Material 7, but that's just because it is based on a fork. I am using Angular 14.2.0 with Material 14.2.2 in my own project and it has the same problem.

I have also tried to add a split outside all of the Material elements. Even there the gutter still does not render unless I have the following styling on the container around the split:

<div style="width: 500px; height: 500px">

Can someone explain what might be the cause of this? It is perhaps something simply I have missed.

Edit:

It turns out that it is actually the height requirement that makes a difference. Why I try to set a fixed height on the container around the split, even inside a mat-card, the gutter shows up.
Where is this height requirement documented?

Footnotes

1. Based on https://github.com/angular-split/angular-split/blob/main/src/app/examples/custom-gutter-style/custom-gutter-style.component.ts#L17 ↩

[Harpush]

Seems related to #268