Home>Support>SiteOrigin Image Collapse help needed

SiteOrigin Image Collapse help needed

I have setup a row with 6 SiteOrigin images for desktop view on my shop main page for categories. On Mobile these images collapse to 1 Image per row but I need it to be 2 images per row. I have tried the Additional CSS Code below which I added to my theme which most support forums refer to make the images scale smaller but it still collapses after each image even though the image size is less than 50% including the margins. Can someone help perhaps to ensure 2 images displayed on mobile per row ? My knowledge on CSS and programming is very little.

@media only screen and (max-width: 767px) {
img {
width: 46%;
}
}

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 15 days, 10 hours ago Andrew Misplon Hi, I Work Here

    Hi Johan

    Thanks for reaching out.

    The CSS posted in your query will target the images, to change the collapse behavior you’d need to target the containers involved.

    Page Builder rows have the option to change the collapse order (left to right or right to left). It’s also possible to turn column collapse off. Unfortunately, at the moment, it isn’t possible to change the columns per row based on a responsive breakpoint.

    Due to limited resources, our free support scope covers basic usage and troubleshooting. We’re able to assist with Custom CSS changes of this nature within our SiteOrigin Premium support scope where we have the budget to do so.

Please log in to post on our forums. Signing up is free.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More