Grid List

mat-grid-list (deprecated — use CSS Grid instead).

Basic Grid List

Note: mat-grid-list is deprecated. CSS Grid is recommended instead.

mat-grid-list with 3 columns (2 on mobile) and 100px row height.

Tile 1

Tile 2

Tile 3

Tile 4

Tile 5

Tile 6

Code

Template

TypeScript

<mat-grid-list [cols]="cols" rowHeight="100px">
  <mat-grid-tile>Tile 1</mat-grid-tile>
  <mat-grid-tile>Tile 2</mat-grid-tile>
  <mat-grid-tile>Tile 3</mat-grid-tile>
  <mat-grid-tile>Tile 4</mat-grid-tile>
  <mat-grid-tile>Tile 5</mat-grid-tile>
  <mat-grid-tile>Tile 6</mat-grid-tile>
</mat-grid-list>