angular5 - 如何在同一行显示两个垫卡

Question

我有未知数量的卡片，我想在它们上 ngfor 并在一行中显示每两张卡片

<mat-card class="example-card">
  <mat-card-header>
    <div mat-card-avatar class="example-header-image"></div>
    <mat-card-title>{{user.firstName}}</mat-card-title>
    <mat-card-subtitle>{{user.lastName}}</mat-card-subtitle>
  </mat-card-header>
  <mat-card-content>
    <p>
      The Shiba Inu is the smallest of the six original and distinct spitz breeds of dog from Japan.
      A small, agile dog that copes very well with mountainous terrain, the Shiba Inu was originally
      bred for hunting.
    </p>
  </mat-card-content>
  <mat-card-actions>

  </mat-card-actions>
</mat-card>

我正在使用 angular 5 和 material design 6
有没有办法做到这一点？

Answer 1

花了几个小时...结果证明是微不足道的:只需将 float:left 添加到您的类 CSS 中即可。就我而言，它看起来像这样:

.example-card {
    max-width: 300px;
    margin-bottom: 50px;
    float: left;
}