Vuetify – make square v-card with centered text (both axis)

Use this css:

.v-responsive__content {
    display: flex;
    flex-direction: column;
    align-items: center;
    // justify-content: center; // this will make everything vertical center
    justify-content: space-between

.v-responsive__content > div {
    width: 100%;

You can name space the class for any css conflict:

.my-card .v-responsive__content { ... }

CLICK HERE to find out more related problems solutions.

Leave a Comment

Your email address will not be published.

Scroll to Top