Dotdotdot brakes grid display

[MrTimber]

I have some Bootstrap cards on a wrapper with class .cards-grid using grid display:

.cards-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));
}

Then I limit the height of the text on the card body:

.card.card-body .card-text.dot-dot-dot {
    max-height: 120px;
    overflow: hidden;
}

And I use Dotdotdot on it to add the ellipsis (I use jQuery, but you can do the same in pure Javascript):

$(function() {
    $(".dot-dot-dot").each(function () {
      new Dotdotdot(this);
    });
});

Dotdotdot works to add the ellipsis but it brakes the grid display.

I get this with Dotdotdot:

Instead of this without Dotdotdot: