Topic: Unable to position card body at the bottom of card

Niek Jonkman free asked 4 years ago

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.)

First two cards need to be positions just as the other two.

<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>

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

        <h4>{{ title }}</h4>





    height: 100%;


How do I align all the cards nicely?

Thanks in advance.

Arkadiusz Idzikowski staff answered 4 years ago


If you need set of cards with equal height, please take a look at the card decks section in our documentation:

Please insert min. 20 characters.


Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.



Specification of the issue

  • User: Free
  • Premium support: No
  • Technology: MDB Angular
  • MDB Version: 7.4.3
  • Device: Desktop
  • Browser: Chrome
  • OS: Windows 10
  • Provided sample code: No
  • Provided link: No