Can we re-style on conditional visibility?

Hi there!

I am making a page wherein I want 3 icons in a row if they exist, but hide them if we don’t have that field.

I am able to do this if they’re conditionally visible. However, I end up with a lot of space where the icon would be if we had it.

Ideally, they would fit next to each other if we have only 2 icons in the row. Is this possible? I’d like some kind of dynamic styling where I can make sure they’re equally spaced at all times.

Regards,
Silas B.


Here is my site Read-Only: https://preview.webflow.com/preview/nexient-dev?preview=2eda9715c00402c1c50ae63ffa5f0e2e
Here’s my site public link: https://nexient-dev.com

Hey do you still need help?

I think i got a sollution for you :slight_smile:
Build it up like the following

Div(iconswrapper)> Div(single item wrapper) > Image > paragraph
Copy paste the “single item wrapper” 3 times.

now make the Div(iconswrapper) a flexbox with > horizontal - justify:center and align:start

connect the cms icons to image and the cms text to paragraph

Now make the div(single item wrapper) a flexbox with > vertical - justify:center and align:center

the last step is giving each Div(single item wrapper) a conditional visibility.

Hope this works for you :slight_smile:

1 Like

That’s awesome!

I’m learning more and more about Webflow each day.

This was very helpful and it seemed to work; thank you!

Regards,
Silas B.