I am trying to make a container take full width but it’s still scrollable. I’m using tailwind.
This is the code for that particular page.

<div class="h-screen bg-black">
<mat-toolbar class="relative z-10 w-full ">
  <button mat-button>
    <mat-icon mat-icon-button (click)="ToggleMenu()">menu</mat-icon>
    
  </button>
  James Smith
</mat-toolbar>
<mat-sidenav-container class="bg-cyan-400">
  <mat-sidenav mode="side" opened *ngIf="collapsed"[style.width] ="'250px'" >
    <app-sidenav>

    </app-sidenav>
  </mat-sidenav>
  <mat-sidenav-content>
    <router-outlet></router-outlet>
  </mat-sidenav-content>
</mat-sidenav-container>
</div>

Here is how the container looks but I want to remove that scrollable bar and that space down.

I tried using overflow-hidden but it didn’t work, I tried overflow-clip but I think that would cut out the content instead.