Currently working with Angular Material 16 and I have a question regarding the height of buttons inside the mat-menu element.
Here is an example of the code:
<button mat-icon-button>
<mat-icon>more_vert</mat-icon>
</button>
<mat-menu>
<button mat-menu-item>Menu A</button>
<button mat-menu-item>Menu B</button>
</mat-menu>
In inspecting the menu, I noticed a class: .mat-mdc-menu-item
that sets min-height
to 45px;
I am looking to change this property to 35px;
Instead of creating a custom class for each instance, I want to apply this style globally to all mat-menu buttons in the application.
The goal is to have the desired height applied universally to all mat-menu buttons.
Although I tried modifying the .mat-menu-item
class, it did not achieve the desired result.
.mat-menu-item {
max-height: 35px;
}