I am building a grid of user posts where a post has some text and an image(optional). The height of the post varies due to presence/absence of the image as show below. This difference in height creates white space below the posts that don't have an image as shown below. The columns in the image below are taking as much height as content with the help of align="start". But still other posts do not fill up the white space available.
Here is my code
<v-container>
<v-row align="start"
><v-col v-for="post in posts" :key="post.id" cols="12" sm="6" md="4"
><v-card
><v-img v-if="post.img" height="200" :src="post.img"></v-img>
<v-card-text>{{ post.text }}</v-card-text>
</v-card>
</v-col>
</v-row>
</v-container>
Kindly suggest how to solve this or a workaround or some alternative approach to implement this kind of grid.
thanks