Grid-like layout using Row Layout Block – is there an easier way?

[Dave]

Dave

August 22, 2020 at 8:21 am

Hi,

This is just a generalised low-priority question….

I have completed the layout of a categorised logo display page which uses a 3 column Row Layout block for each row and and advanced heading for each Logo Category title. It took a lot of tweaking of individual column bottom-margins for mobile layout and some tweaking of Row Layout padding to ensure all the gaps between logos and headers were symmetrical, particularly for mobile. I couldn’t just set same gutter for desktop and different gutter for mobile which would have been gloriously simple as the end gutter (where empty columns were hidden on mobile) cause spacing variations. Is there a way to instruct it to hide the gutter on mobile if the column is being hidden also? << this would have made it much easier to layout.

The other issue I encountered is that I would have liked to have had each logo/brand-text column in it’s own single column row layout but I found it near impossible to get all the symmetrical spacing across devices as i have it now. I think the overheads of all the additional settings, if it was even possible would have negated the small advantage in having a bit more control of exactly where the logo and the text floated.

For a website builder, this level of tweaking is fine but trying to explain to a customer how to add more logos with all the exceptions to the layout settings would be near impossible. So I was hoping you would be so kind as to take a quick peak and see if you feel there was some easy to achieve the same result as I have now?

Many thanks