Jump to content

Custom CSS Code to Prevent Stacking of Image Blocks in Mobile Version

Recommended Posts

Hey there!

I am wondering if there is a way to prevent all of my images from stacking in the mobile version of my "Collections" page on my site? I have utilized several image blocks to create a kind of collage effect which looks great on the desktop version, but it totally breaks down on the mobile version - requiring the customer to scroll through ALL of the images blocks one by one. I'm a CSS novice and have tried manipulating the code myself, but my brain is now mush and I need to call someone in from the sidelines who's brain is fresh and who is better qualified 😂

Any help is greatly appreciated - thank you so much 🙂 

Mobile Version.PNG

Desktop Version.PNG

Link to comment
  • Replies 1
  • Views 1.2k
  • Created
  • Last Reply

Top Posters In This Topic

Popular Days

Top Posters In This Topic

Posted Images

Assuming you're on Squarespace 7.1 - which it looks like because you appear to be using the fluid engine (grid) layout - you can just switch to mobile view and edit the layout there.


Work With Me 🖥️💻📱

Please remember to tag me so that I get a notification and respond to your help requests.

If my answers have helped you, please drop a like and mark my answer as best to help other users find solutions quickly.

You can also thank me or make requests by buying me a coffee . (Caffeine fuels me to take more requests)

For Squarespace Tips & Tricks, visit @squareskills (Youtube 📺 Tutorials)

For Premium and FREE plugins, visit Squareskills (Plugin Store) 🧩

Some links may be affiliate/referral links.

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.