How can I fix the lack of margins on mobile product pages?

[Adca]

Hi there, can someone please help me?? For some reason on mobile, my product pages doesn’t have margins… when I try to correct with the solutions of the community (https://community.shopify.com/c/shopify-design/product-margins-on-mobile-different-than-desktop/m-p/1557046), it still doesn’t work.

Here is a link from my website : https://les-echiquiers-du-roi.fr/collections/echiquiers-et-jeux-echecs/products/echiquier-en-bois-de-charme

The issue also concerned the home page. It works fine on desktops, the issue is only on mobile devices. My theme is Turbo 5.0

Here you can see how it was before :

Thanks!

[suyash1]

@Adca - please add this css to the very end of your styles.scss file and check, should look like screenshot below and adjust number 30 in middle as per the need, it is for left/right spacing

.product-template div.content{padding: 30px 30px 15px;}

.index-sections {padding: 0 30px;}

[Adca]

It works perfectly now. Thank you very much.

[suyash1]

@Adca - welcome, please do let me know if you have any more updates.

[Adca]

I see the issue is the same for the footer, do you know what to do ?

[suyash1]

@Adca - have you disabled right click?

[Adca]

Yes, it’s enable now