Change Image on Stacked Image Block on mobile

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

Hi,

I am looking for a solution to replace the image displayed on desktop (horizontal) with one optimized for mobile (vertical). Thanks for your help.

21 minutes ago, bangank36 said:

@media only screen and (max-width: 600px) {
  #block-yui_3_17_2_1_1604669061431_13134 .intrinsic > div {
      padding-bottom: 204%;
    	background: url(REPLACE-YOUR-URL) no-repeat;
  		background-size: cover;
  }
  #block-yui_3_17_2_1_1604669061431_13134 img {
    	display: none;
  }
}

Please do the following things

1. Upload the image and get its url from custom css panel

Using the CSS Editor – Squarespace Help

2. Replace the image url to this code and add it to Settings->Design->Custom css

Great!!! Thank you so much!!

I have a horizontal image showing on desktop of 8 instagram images. Normally I would just connect the instagram feed but she didn't want that but instead an 8 image collage. I am trying to show a stacked version on mobile view but it is not showing up. I am not sure if I did it correctly.

On Desktop: 

Would like it to look like this on Mobile:

Any help is appreciated.

https://trombone-scarlet-kk6s.squarespace.com/
 

PW: TMCCustomHomes

On 12/18/2021 at 10:46 PM, LulubelleDesignStudio said:

I have a horizontal image showing on desktop of 8 instagram images. Normally I would just connect the instagram feed but she didn't want that but instead an 8 image collage. I am trying to show a stacked version on mobile view but it is not showing up. I am not sure if I did it correctly.

On Desktop: 

Would like it to look like this on Mobile:

Any help is appreciated.

https://trombone-scarlet-kk6s.squarespace.com/
 

PW: TMCCustomHomes

It is 1 image, not 8 images, so no need to make 2 images/row on mobile. You can check again