mat-grid-tile-content how to edit the style

Question

I would edit the style of this class 'mat-grid-tile-content'

this is my code:

 <mat-grid-tile [colspan]="3" [rowspan]="2">
    <mat-list role="list">
         <mat-list-item role="listitem">Item 1</mat-list-item>
         <mat-list-item role="listitem">Item 2</mat-list-item>
         <mat-list-item role="listitem">Item 3</mat-list-item>
         </mat-list>
 </mat-grid-tile>

I tried to access to the class in this way, but doesn't work:

::ng-deep mat-grid-tile-content {
  display: flex !important;
  align-items: start !important;
  justify-content: flex-start !important;
  flex-direction: column !important;
}

Answer 1

You need to use . when you are searching for a class in your selector:

::ng-deep {
   .mat-grid-tile-content {
      display: flex !important;
      align-items: start !important;
      justify-content: flex-start !important;
      flex-direction: column !important;
  }
}

or

::ng-deep .mat-grid-tile-content {
  display: flex !important;
  align-items: start !important;
  justify-content: flex-start !important;
  flex-direction: column !important;
}