[Solved] [V1] QCard Layout - How to get QCards to be the same height?

[Stanley]

Dear Quasar team,

Could you please have a look of my demo?
https://codepen.io/Stanley-549393092/pen/qBWvOye
As you can see,
1). on big screen, all three cards should be on the same line
2). on small screen, all three cards should be wrapped to a new line.

I just wanna ask is that possible to let them have the same height on the big screen?

[s.molinari]

I’m far from an expert, but adding a min-height to the divs containing the cards should work.

Scott

[Stanley]

@s-molinari Thanks!

[s.molinari]

I am not sure if this will help, but I ran into the situation in helping someone else. But, the cards are the same height.

https://codepen.io/smolinari/pen/dybrZjb

Scott

[mvelikoff]

@Stanley , in your case, you can add “flex” class to the wrapper q-card’s div, and add class “full-width” or “fit” to the q-card tag.
https://codepen.io/mvelikoff/pen/zYObWxW

[s.molinari]

Nice! Thanks @mvelikoff.

Scott

[Stanley]

@mvelikoff It’s cool. Thanks a lot!