CODEWITHSUNDEEP
angularangular-material
PuntanetDeveloper
PuntanetDeveloper

Reputation: 318

angular 4 angular-material mat-card in only row

I need of place side by side in only row 2 mat-card.. how can I do?

<mat-card class="example-card">
  <mat-card-header>
    <div mat-card-avatar class="example-header-image"></div>
    <mat-card-title>Shiba Inu</mat-card-title>
    <mat-card-subtitle>Dog Breed</mat-card-subtitle>
  </mat-card-header>     
  <mat-card-content>        
  </mat-card-content>     
</mat-card>

I want to get this

enter image description here

Upvotes: 1

Views: 9866

Answers (2)

envereren
envereren

Reputation: 118

You can add a style to your div:

<div style="display:flex; flex-direction: row;">
   <mat-card class="example-card">
      ...
   </mat-card>
   <mat-card class="example-card">
      ...
   </mat-card>
</div>

Upvotes: 4

Ankita Jaiswal
Ankita Jaiswal

Reputation: 262

You can use flex layout for this. https://alligator.io/angular/flex-layout/

Upvotes: 2

Related Questions