Custom row layout not aligning correctly for mobile

Hi,

Can you please have a look at this page: http://irds.hobartwebdesigns.com.au/

In the Our Brands and Our Clients sections, I use 6 rows in full width layout. In the column settings > Advanced, I set medium device width to be custom and 33.33% and small device width to be custom and 50%.

I wanted it to be:
Full width - 1 row x 6 columns
Medium - 2 rows x 3 columns
Small - 3 rows x 2 columns

For some reason at the medium screen breakpoint, row 1 is correct with 3 columns, but column 1 of row 2 sits on its own row, with a third row containing the last 2 columns.

Likewise on the small screen, the rows do not line up.

I have tried to recreate the row but it remains the same.

Any advice you could provide would be most appreciated.

Hey Graham,

I tried to create the same layout on my end and it works just fine. Do you think you can provide us a temporary admin access to the site so we can check?

Ben

Hi Graham,

I think I’ve figured out the issue. This is caused by the custom margins you’ve applied to the images. I’ve managed to change all of the images to the same one with the exact same margins and they look fine. Check screenshot.
http://imgur.com/NObGKAK
I would suggest edit those images so they have the same sizes and you don’t have to add those extra margins.

Hope this helps!

Ben

Fantastic! I will give it a try tomorrow.

Many thanks for your help Ben.

No problem, Graham. If you could get back to us regarding how it goes we’d greatly appreciate it!

Ben

OK, I have all images with the same canvas size and margins now AND I had 2 of the 3 column widths for the medium screen at 33.34 instead of 2 x 33.33 and 1 x 33.34 (schoolboy error…!)

Thanks again for your help.

Hey Graham,

Sorry as it wasn’t stated on your post. Did that took care of it? :slight_smile:

Ben

Yes all good now. Totally my fault on that one.
You may mark this as resolved.

That’s good to know, Graham! I actually checked your site again and it didn’t seem to reflect the changes you mentioned so I was curious. Anyway, marking this as resolved now. Have fun with The Beaver!

Ben

The site is now live and I made the changes there: http://www.irds.com.au