Now streaming live

Issue in making equal size cms item for all cards using flexbox


#1

Hi

How to fixe the card size using flexbox or without it ( even if the content is long or short, all one size) exactly like eventbright.

I want to be just 3 cards per row for web and one for mobile
You can find my cards > Pages> Cities template


#2

no one have an idea?


#3

Hi @MRX can you share your public link please.



#4

Hi @Anna_Kelian,

you'll find it : pages > cities template


#5

Hey @MRX

  1. you have correctly added the Align self: stretch to the dynamic item. So, that means the element that will make your cards look equal is the dynamic list. So you need to add the border to the dynamic list and not the link block inside, ok?

  2. Set the link block to have width: 100%

  3. give the dynamic list a width: 31.33% and horizontal margins of 1%. and for the other devices, make the width: 100%.

Hope this helps, get back to us if you need anything else.

Good luck,
Anna K


Note: don't use Height: Auto unless you are overriding a height value other than auto. Also don't use height value for any container with flexible text characters. Your .title-wrapp is set to height:40% But I see that the title is the name field which has no character limit. This will break your design. So either have a separate title field in your events collection with character limit, or remove the height value. But to achieve the design you want , it's better if you set the limit.


#6

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.