Make gallery 3 columns on mobile view for Squarespace 7.1

I see 3 columns on mobile here. Did you solve this?

On 2/19/2021 at 12:08 PM, tuanphan said:

I see 3 columns on mobile here. Did you solve this?

No, it still show as two columns on mobile, please see attached. Thanks,.

On 2/24/2021 at 4:13 PM, 18250907 said:

No, it still show as two columns on mobile, please see attached. Thanks,.

It looks like you solved this?

Also do you want to add space between site title - cart icon?

On 3/1/2021 at 9:22 PM, tuanphan said:

It looks like you solved this?

Also do you want to add space between site title - cart icon?

I see.. I don't know why it still shows as two columns on iphones. 
If I can put space between logo and cart that would be great, thank you so much in advance 

On 3/9/2021 at 12:57 PM, 18250907 said:

I see.. I don't know why it still shows as two columns on iphones. 
If I can put space between logo and cart that would be great, thank you so much in advance 

Ah, sorry for the delay. Just checked again. This is not possible.

But if we use code to change masonry to grid on mobile, we can set 3 items/row. Do you want to change to grid on mobile? We will give the code

On 3/20/2021 at 2:18 PM, tuanphan said:

Ah, sorry for the delay. Just checked again. This is not possible.

But if we use code to change masonry to grid on mobile, we can set 3 items/row. Do you want to change to grid on mobile? We will give the code

Yes! Code will be great!

On 3/22/2021 at 4:29 PM, 18250907 said:

Yes! Code will be great!

Try adding to Design > Custom CSS

/* Masonry to grid mobile */
@media screen and (max-width:767px) {
	.gallery-masonry-wrapper.gallery-masonry-list--ready {
    height: auto !important;
    display: grid;
    grid-template-columns: repeat(3,1fr) !important;
    grid-column-gap: 10px;
    grid-row-gap: 10px;
}
figure.gallery-masonry-item {
    position: relative !important;
    width: 100% !important;
    transform: unset !important;
}
.gallery-masonry-item-wrapper {
    height: 100% !important;
}
}