title: Making a responsive grid of cards in Vuetify
body: <p>I'm trying to create a responsive grid with cards in Vuetify. Every card must be the same size but if I add a long text under it (second card), the card is always the max size (I also make this with <a href="https://vuetifyjs.com/en/features/breakpoints/" rel="nofollow noreferrer">breakpoints</a> but Vuetify only has 5 breakpoints and I would need it more. I could add a custom breakpoint for every column but that is a bit ugly solution).</p>
  <p>Also last row must be aligned to the left like in the sketch below. I tried a lot of things but I want to use min-width and max-width so the gap between the cards would, in most cases, be the same. It should look something like this:</p>
  <p><a href="https://i.stack.imgur.com/CRcD1.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/CRcD1.png" alt="Preview - grid of cards" /></a></p>
  <p>Here is my <a href="https://rb.gy/f6n7d2" rel="nofollow noreferrer">codepen</a>.</p>