To flex or to grid?

Hi!

Near the bottom of the home page is a grid of several brand logos. Making them viewable across devices is proving to be a challenge because their sizing and spacing adjust to look either messy or very, very small.

If someone has some ideas on how to make this more functional, I’d be very grateful.


Here is my site Read-Only: https://preview.webflow.com/preview/amys-first-project-f2101e-0775eee45fde7?utm_medium=preview_link&utm_source=dashboard&utm_content=amys-first-project-f2101e-0775eee45fde7&preview=ca811d3bb0aa5bb031087e07fdbe940d&mode=preview

What you’ve done is great. You just need to reduce the columns, gap, and margin on smaller devices.

1 Like

That’s a lot of logos! I do wonder if you’d be better off sprinkling them across the page. Have one or two rows each time in-between sections. To answer what you actually wanted to know :slight_smile: , I’d use several blocks for this, a div set to ‘block’ for the outer wrapper holding all the logos, then I’d put each row of icons in another div, set to flex. This gives you better control over all the elements.

1 Like