How to set different size to divs for data from CMS?

M_Sysoev · June 5, 2020, 5:19pm

Hi everyone!
I have a list of tags that I get from CMS. In design, each block with a tag has a different size.
But when I get tags from CMS all blocks have the same size in spite of that the width = Auto for the Collection wrapper, Collection Item, and div block inside Collection Item.
Have any idea how to set these divs with different width?

mikeyevin · June 5, 2020, 5:26pm

Can you please include your read-only link so I can look into how you set this up?

M_Sysoev · June 5, 2020, 5:41pm

Sure. I have improved result a little — I set Flex/Horizontal for collection item and divs changed their width but now the width of some divs is less than text width.

https://preview.webflow.com/preview/page-for-test?utm_medium=preview_link&utm_source=designer&utm_content=page-for-test&preview=0a09edf37bfbfc30ec855d0c268f2866&mode=preview

mikeyevin · June 5, 2020, 5:46pm

https://www.loom.com/share/277dc0c7cafa4553a116d56e9db516ec

I recorded a quick video with the few changes needed, but basically you’ll need to adjust the Collection Item Tag element to display: inline-block, remove the min-width and set width: auto

M_Sysoev · June 5, 2020, 5:53pm

Amazing! Thank you very much for your assistance!