How to make Gallery Grid 2 Columns on Mobile [Paloma Template]

@RyanDejaegher  Thanks! I'd missed the transform unset and apparently had transposed the "m"&"n" in columns. 🤦🏻‍♂️. 

Works great except the height is not scaling down. 

@JasonGipson you can add this to adjust the height

 

.gallery-strips-item img {
    object-fit: contain !important;
    height: 100% !important;
}

Perfect!

On 6/16/2020 at 5:59 PM, RyanDejaegher said:

@JasonGipson

/* Add this code to Design -> Custom CSS */
 

@media(max-width:767px) {
.gallery-strips-item {
    width: 100% !important;
    position: unset !important;
    transform: unset !important; 
}

.gallery-strips-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 20px;
    height: unset !important;
}

}

Result:

I've added this code but the only issue is that it fixes the images size by width rather than height so there's a blank space when it's a landscape and portrait image side by side. 

The gallery in question is www.gabrielasilveira.squarespace.com/commissioned and the password is hello

Thank you for all your help! 

Hi,

with the codes above I couldn't figure out how to change the gallery block items to 3 per row (+ adjusting the size/padding) for mobile. 
(I also used text beside gallery for desktop view, but that shouldn't make a difference, am I right?)

This is the URL to my site:  
https://www.inneco.de/eco-premium-eco-basic

Hope you can help me with this issue!
Thanks a lot!

On 12/1/2020 at 2:27 AM, ando_337 said:

Hi,

with the codes above I couldn't figure out how to change the gallery block items to 3 per row (+ adjusting the size/padding) for mobile. 
(I also used text beside gallery for desktop view, but that shouldn't make a difference, am I right?)

This is the URL to my site:  
https://www.inneco.de/eco-premium-eco-basic

Hope you can help me with this issue!
Thanks a lot!

Add to Home > Design > Custom CSS

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

Thank you, solved it by using a picture with the 6 icons!