Featured product picture not centerd on mobile

[Itsnotcenterd]

Cant center my fetured product pic on mobile view. Please HELP. 

https://multikul.store/

[niraj_patel]

Hello @Itsnotcenterd 

You can add code by following these steps

1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file

3. Paste the below code before </body> on theme.liquid
<style>
@media screen and (max-width: 749px) {
 .Slider-Gallery-template--23139480371468__featured_product_NBRaQ7 .grid--peek.slider .grid__item:first-of-type {
       margin-left: unset !important;
 }
}
</style>

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

[Dan-From-Ryviu]

Hi @Itsnotcenterd 

You can solve it by adding code to Custom CSS of Feature product section. 

.grid__item { margin-left: 0px !important; }

[Moeed]

Hey @Itsnotcenterd 

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 </body> tag

<style>
.grid--peek.slider .grid__item:first-of-type {
    margin-left: 0 !important;
}
</style>

RESULT:

If I managed to help you then, don't forget to Like it and Mark it as Solution!

Best Regards,
Moeed

[GTLOfficial]

Hello @Itsnotcenterd 

Go to online store ---------> themes --------------> actions ------> edit code------->base.css ----> line number 951
search this code

@media screen and (max-width: 749px) {
.grid--peek.slider .grid__item:first-of-type {
margin-left: 1.5rem;
}
}

and replace with this code

@media screen and (max-width: 749px) {
.grid--peek.slider .grid__item:first-of-type {
margin-left: 0px !important;
}
}

 result

If this was helpful, hit the like button and mark the job as completed.
Thanks

[dws_pvt_ltd]

Hello @Itsnotcenterd, Please follow these steps to add this CSS code:
1. Go to your Online Store
2. Click on "Themes"
3. Select "Edit code"
4. Open your CSS file. open "base.css"
5. Add the following code.

Update this below CSS by find this class with this media query ".grid--peek.slider .grid__item:first-of-type" 

@media screen and (max-width: 749px) {
    .grid--peek.slider .grid__item:first-of-type {
        margin-left: 1.5rem; /* remove or comment this CSS code */
        margin-left: 0rem; /* add this new CSS code */
    }
}

Feel free to reach out if you have any questions or need assistance.
Best Regards,
DWS.