3 images in a row mobile version

Site URL: https://www.jameshandleydp.com

Hello, looking to get rows containing three images on mobile version?  I have 3 image rows on my homepage in desktop and would like this to be the same in mobile, Ive tried some previous codes and nothing has worked yet. Any help would be greatly appreciated. 

Many thanks 

7 minutes ago, kickflipking said:

Site URL: https://www.jameshandleydp.com

Hello, looking to get rows containing three images on mobile version?  I have 3 image rows on my homepage in desktop and would like this to be the same in mobile, Ive tried some previous codes and nothing has worked yet. Any help would be greatly appreciated. 

 

Many thanks 

Have you tried Fluid Engine? Within a Fluid Engine Section you can place and resize images (or any block) specifically for mobile or desktop. This gives you the ability to do exactly what your describing natively in Squarespace without using custom code. 
 

Thanks, I have tried this but not perfect for what I need as resizing each image in mobile to be exactly the same size is difficult, can't seem to be able to duplicate images in the mobile mode. Think code which matches everything could be easier unless there's away in fluid engine to match image sizes to be exactly the same in the mobile version. 

Thanks again. 

10 hours ago, kickflipking said:

Thanks, I have tried this but not perfect for what I need as resizing each image in mobile to be exactly the same size is difficult, can't seem to be able to duplicate images in the mobile mode. Think code which matches everything could be easier unless there's away in fluid engine to match image sizes to be exactly the same in the mobile version. 

 

Thanks again. 

Try adding to Design > Custom CSS

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

Thank you for the code, this solved it!