css - 打开时调整 mat-side-nav 的宽度

Question

当导航栏被点击打开时，导航栏的宽度会随着内容自动调整。

 <mat-sidenav #sidenav  mode="side" class="primary-color main-sidenav nav- 
 shadow" opened="true" [@sidenavState]="sidenavState" 
 (@sidenavState.done)="endAnimation()" *ngIf="layout === 'modern' || 
 forceModern">
 ....
 </mat-sidenav>

当我将 SCSS 中侧导航的宽度设置为

.mat-side-nav{
   width: auto !important
 }

导航栏默认打开，无需点击打开。它也不会通过点击关闭

Answer 1

您的问题：当您执行以下操作时： .mat-side-nav{ width: auto !important }

这是一种硬编码宽度以获取它包含的任何内容。

解决方案：找到打开时处于活动状态的类，并为该类设置宽度：自动。