Keep Product Images from being the whole screen wide on the Prestige theme

[Jarch2]

On mobile devices, the product images take up 100% of the width of the screen. I want it to have some padding around the images so the image would be like 80% the width of the screen. My store is https://mk0uuf-h3.myshopify.com/products/balloon-lamp

[BiDeal-Discount]

Hi @Jarch2

let try to add this Custom CSS:

@media screen and (max-width: 1007px) {
  .Product__Wrapper .Product__Gallery {
    max-width: 80%;
    margin-inline: auto;
  }
}

[Moeed]

Hey @Jarch2

Follow these Steps:

1. Go to Online Store

2. Edit Code

3. Find theme.liquid file

4. Add the following code in the bottom of the file above tag

RESULT

If I managed to solve your problem then, don’t forget to Like it and Mark it as Solution!

Best Regards,
Moeed

[Dan-From-Ryviu]

Hi @Jarch2

You can add this code to Custom CSS in Online Store > Themes > Customize > Theme settings to do that.

@media (max-width: 749px) {
.Product__Gallery { padding: 0 24px !important; }
}