I am working with mat-card where I want to put mat-cards as 2x1 ie; 2 cards per row in mobile views and 3 cards per row in tab and laptop view.
I followed this example with grid-list and this is what I want to achieve. I tried with mat-card with the same approach and is not working.
I used flex-layout but it is not proper. Any suggestion on how to achieve this?
<div class="cardList" fxLayout="row wrap" fxLayoutAlign="flex-start" fxFlexAlign="stretch" fxLayoutGap="20px">
<mat-card fxFlexAlign="stretch" *ngFor="let member of members" routerLink="/registration/verify-phone">
<mat-card-header style="flex-direction: column;" fxFlex="60">
<mat-card-title style="color: #0663fe; font-weight: 600;">{{member.content}}</mat-card-title>
</mat-card-header>
</mat-card>
</div>