html - Vuetify Card Text Overflow - Multiline text ellipsis

Question

I'm working with Vuetify cards. As you can see in the picture below, the cards' height is variable until it reaches its max-height (I've set this value to 225px). I'd like to add a text-overflow: ellipsis once it surpasses the limit.

Vuetify code

<v-card rounded dark class="rounded-xl" max-height="225">
    <v-card-text class="elip">{{info.description}}</v-card-text>
</v-card>

What I've tried

.elip{
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

A style class "elip" is added, and the end result is a one line card with ellipsis.

question from:https://stackoverflow.com/questions/65926473/vuetify-card-text-overflow-multiline-text-ellipsis

Answer 1

Waitting for answers