How to cover side part by Product image (in mobile)

[Avalonz]

How to remove side part which is showing previous and next image and make the product image completely cover area (In mobile) like i shown in image with red box.

 

[Darshanp712]

Hello @Avalonz, If you are using the dawn theme then please make the changes as per the below CSS. This CSS is in the "base.css" file. you can find it in that file and make changes in it if you want. Please comment on older code and add this code in this file or else comment on this code in this file and make a new code snippet or CSS file or simply just put it in the "main-product.liquid" section file.

@media screen and (max-width: 749px) {
    .grid--peek.slider .grid__item:first-of-type {
        /* old css-> margin-left: 1.5rem;*/
        /* add new below CSS */
        margin: 0 1.5rem;
    }
}

 If you still have any doubts then please reply.

Best regards, 

Darshan Prajapati.