How to use flexbox to align & center feature grid

Hey guys,

I have the following feature grid set up:

Is there a way to vertically center all images so that they’re perfectly aligned with each other? Every image is at a different position right now, as shown in the screenshot.

Here’s how I have it set up. I have the flex parent:

And then I have the flex children as flex items:

Each flex item contains the image and heading as shown in the first screenshot.

Here is my read-only link: Webflow - Just One Dime

Thanks guys!

Hi @jkniep

Can you update your post with the page it’s located on please? :smiley:. There’s a lot of pages there!

Yes! It’s called China Sourcing Trip

You can give a minimum height of 100px to the text wrapper as it’s the text that is causing the images to be mis-aligned.

If you change the text size you’ll need to adjust this accordingly of course.

CloudApp

Thank you so much! This worked!

1 Like