Expected behavior Hello, I am trying to position the body of a card, at the bottom of the card, aligning it with the bodies of other cards. I have one row with all my columns in it. Every column has one card.

Actual behavior When I use full height (100%) for the card, the body does not move along, and it looks ugly. I don't know how to do this. I have tried several listed solutions (including ones on this site) but I can't get it to work.

Resources (screenshots, code snippets etc.)

<mdb-card [class]="width" class="card">

  <div *ngIf="src != undefined && alt != undefined">
    <div [class]="wavesEffect" mdbWavesEffect>
      <mdb-card-img [src]="src" [alt]="alt"></mdb-card-img>
    </div>
  </div>


    <mdb-card-body class="card-body">

      <mdb-card-title>
        <h4>{{ title }}</h4>
      </mdb-card-title>

      <mdb-card-text>
        <ng-content></ng-content>
      </mdb-card-text>

    </mdb-card-body>

</mdb-card>

And:

.card{
    height: 100%;
}

.card-body{
    //?????????
}

How do I align all the cards nicely?

Thanks in advance.