Is it possible to have different settings for a gallery block on mobile compared to desktop?

I am using a simple gallery grid that has 3 images per row on desktop, but I would like to have them stacked on mobile (one image per row). They are too small to be shown next to each other on mobile. If I change the settings on the mobile version, it affects the desktop design as well. Is it possible to have different layouts on desktop vs mobile?

Hi. Yes. Possible. If you share link to page where you use gallery, we can help easier

Hello @tuanphan, 

Im after the same solution. One column for Gallery Grid: Simple on Mobile:

https://arugula-ladybug-m8r2.squarespace.com/work

Matt

On 9/13/2022 at 10:47 AM, mattjenkins said:

Hello @tuanphan, 

 

Im after the same solution. One column for Gallery Grid: Simple on Mobile:

https://arugula-ladybug-m8r2.squarespace.com/work

 

Matt

 

Try adding to Design > Custom CSS

@media screen and (max-width:767px) {
.gallery-grid--layout-grid .gallery-grid-wrapper {
    grid-template-columns: repeat(1,1fr) !important;
}
}

5 minutes ago, tuanphan said:

Try adding to Design > Custom CSS

@media screen and (max-width:767px) {
.gallery-grid--layout-grid .gallery-grid-wrapper {
    grid-template-columns: repeat(1,1fr) !important;
}
}

 

thanks @tuanphan  this works perfectly.