How to make product image full width on phone? ( Turbo theme )

Store Design
1

Hello, I tried some css codes to get rid of the white spacing for the product image on phone

nothing worked

AhmedGhaziii_0-1648315511365.png
AhmedGhaziii_0-1648315511365.png305×631 115 KB

Can you please provide help
my website link:

www.ebarza.com

2

Hi @AhmedGhaziii ,

You can follow the instruction below:

  1. Go to Online Store->Theme->Edit code
  2. Asset->/styles.css->paste below code at the bottom of the file:
@media (max-width: 480px) {
    .product-container .product__images {
        margin: 0 !important;
        width: 100% !important;
    }
    .product-container .product_gallery {
        width: calc(100% + 20px);
        margin-left: -10px;
    }
}

If you feel like my answer is helpful, please mark it as a SOLUTION. Let me know if you have any further questions.

2 Likes
3

Worked perfectly !
Thank you !!