organize cards to specific column in mat-grid-list

[andrew solis]

Hello,

      I have a website I'm working on where I want to display a bunch of card, and each card acts as a download link for a file. I am using mat-grid-list right now and have a total of 5 columns, where each card is placed inside a mat-grid-tile, andI like each card to be placed in a certain column based off a category. Here is a copy of my work so far,

<mat-grid-list cols="5" >

    <mat-grid-tile *ngFor="let item of items">

       <mat-card>

   

           <img mat-card-image src="thumbnails/{{file.filename.split('.')[0]}}.png">

               

           <mat-card-actions>

               <button mat-icon-button>

                   <mat-icon aria-label="Download">cloud_download</mat-icon>

               </button>

               <button mat-icon-button>

                   <mat-icon aria-label="Info">info</mat-icon>

               </button>

                   

           </mat-card-actions>

       </mat-card>

    </mat-grid-tile>

</mat-grid-list>

<app-footer class="footer"></app-footer>

So I like each mat-grid-tile to be placed in a certain column of mat-grid-list based off a certain value. However, it seems that you can define how many rows or columns a tile can take up, but not define it to be a specific column. The tile's will always be the same width and height, never exceeding more than 1 column or 1 row. Am I thinking about this the right way, or is there another way to implement what I'm doing? Any help would be greatly appreciated.

Thanks!

Andrew Solis