Need help with centering elements in mobile viewports

[peted83 (Pete)]

Hope someone can help.

I’m having trouble with auto-centering a component of my site.

They are divs within a container. If you have a look on the ‘partners page’, under any view smaller than desktop, you will see that they sit to the left of the screen rather than centered within the container.

https://preview.webflow.com/preview/monitor-6-5426d28978582cc8f4d33aa3833a0?preview=173466e9376d8a28277d9ec2c47ad952

Could someone possibly tell me why?

Thanks

Pete

[pastiwibawa]

Hi. Cool Flexbox can help you center your boxes.

Try this:

1. At your Partners page, click/select PartnersMainContent and make sure you are on Style tab window after that
2. Position - Display Settings, click/select Flex
3. Under Flex Layout, click/select Justify: Center
4. Get down a bit, there is Wrap Children checkbox, click/select it
5. Tadaaa

Cheers

[peted83 (Pete)]

Hey,

Thanks for the suggestion. I tried that but it would then stack them all on top of each other. They were centered, which is a start, but there was room next to it for another box.

Pete

[pastiwibawa]

@peted83

Just to confirm that we get same result here. This is what I got. If this is not what you trying to achieve, can you please describe it in more detail what it is.

[peted83 (Pete)]

Hey!

Tried this again and it worked, I must have not ticked ‘wrap children’ the first time. You’re an absolute star. Thank you very much for your help.

Pete