v-card equal height

[HanyTaha61]

I need to adjust the height to be equal for all cards.

here is the code:
`

                <v-img
                :src="product.image"
                cover
                ></v-img>
    
                <v-card-item>
                <v-card-title>{{product.title}}</v-card-title>
    
                <v-card-subtitle>
                    <span class="me-1">{{product.category}}</span>
    
                    <v-icon
                    color="error"
                    icon="mdi-fire-circle"
                    size="small"
                    ></v-icon>
                </v-card-subtitle>
                </v-card-item>
    
                <v-card-text>
                <v-row
                    align="center"
                    class="mx-0"
                >
                    <v-rating
                    :model-value="product.rating.rate"
                    color="amber"
                    density="compact"
                    half-increments
                    readonly
                    size="small"
                    ></v-rating>
    
                    <div class="text-grey ms-4">
                    {{ product.rating.rate }} ({{ product.rating.count }} user)
                    </div>
                </v-row>
    
                <div class="my-4 text-subtitle-1">
                Price: ${{ product.price }}
                </div>
    
                <div>{{ product.description }}</div>
                </v-card-text>
    
                <v-divider class="mx-4 mb-1"></v-divider>
    
    
                <v-card-actions>
                <v-btn
                    color=" bg-success"
                    variant="text"
                    class="mx-auto"
                >
                    Buy it now
                </v-btn>
                </v-card-actions>
            </v-card>
            
        </v-col>
    </v-row> 
    </v-card>
</v-container>`