How to remove scrollbar from Mat-tab or Mat-card (Angular Material) How to remove scrollbar from Mat-tab or Mat-card (Angular Material) angular angular

How to remove scrollbar from Mat-tab or Mat-card (Angular Material)


According to the OP's comment on this answer:

Just add dynamicHeight to mat-tab-group.

<mat-tab-group dynamicHeight></mat-tab-group>


I Tried and it worked for me.

.mat-tab-body-content { overflow: hidden!important}


The h2 element inside the mat-list-item has some margin on it by default which is extending outside the mat-list element and causing the extra scrollbar. Removing the h2 or overriding the margin-bottom style will fix the problem:

<mat-list>    <mat-list-item>Lorem</mat-list-item>    <mat-divider></mat-divider></mat-list>

or

<mat-list>    <mat-list-item><h2 style="margin-bottom: 0;">Lorem</h2></mat-list-item>    <mat-divider></mat-divider></mat-list>