Angular Material sidenav with submenu does not push properly when scrollbar visible

angular angular-material mat-sidenav
Evanst picture Evanst · Jun 13, 2018 · Viewed 9.7k times · Source

I am using Angular Material sidenav and my menu has a sub menu. When I open the sub menu a scrollbar appears making the sidenav slightly larger and it covers some of the main content.

See this Stackblitz https://stackblitz.com/edit/angular-raedvz, expand the sub menu and you will see the behavior.

Answer

Shadowlauch picture Shadowlauch · Jun 13, 2018

Adding the autosize attribute should fix your problem. Though that seems to have a performance impact.

Have a look at this github issue: https://github.com/angular/material2/issues/9601

Related questions

Angular + Material - How to refresh a data source (mat-table)

I am using a mat-table to list the content of the users chosen languages. They can also add new languages using dialog panel. After they added a language and returned back. I want my datasource to refresh to show the …

Read More
Confirm password validation in Angular 6

I want to perform password and confirm password validations using material components only,and an error message below the confirm password field if confirm password field doesn't match And if it is empty.Tried many resources unable to achieve. Tried …

Read More
Angular2 material dialog has issues - Did you add it to @NgModule.entryComponents?

I am trying to follow the docs on https://material.angular.io/components/component/dialog but I cannot understand why it has the below issue? I added the below on my component: @Component({ selector: 'dialog-result-example-dialog', templateUrl: './dialog-result-example-dialog.html', }) export …

Read More