Angular Material "Form-Field" with appearance="outline" is cut off from other labels

After updating to Angular Material v15 our form fields look like this (sometimes - depending on if there is a margin/padding from the element above):



This is how it looked like before:



From what I can see (and what they also write in the documentation) they changed the margins. Compare (new version):



vs previous version:



Also to proof that it's not only in our application I prepared a stackblitz sample that shows this behavior as well, see: Stackblitz example

I have fixed the label being "cut off" by adding a padding-top: 8px to all mat-form-fields. However, this feels like a workaround. Is there any better solution for this?

Continue reading...