How can I fix spacing issues on my mobile homepage?

Store Design
1

Hey there,

I have this issue of the homepage being weirdly spaced in mobile view (scroll down). As you can see on the images. The product images don’t spam the 100% width of the screen as on the product page and the rest of the layout is also not nicely centered (Red). The layout of the product page is how im trying to get it (green).

images not spanning 100% and right ide of the rest is miss aligned
images not spanning 100% and right ide of the rest is miss aligned767×717 53.5 KB

Product page, everything fine
Product page, everything fine668×876 185 KB

Thank you for any help!

Store: here

Password: siesoh1

Edit: I believe I’ve fixed the layout but now the pictures are not the same size anymore on the two featured products. (I’ve made them the same to compare).

Edit two: fixed!

1 Like
2

@itsolidude12

Please add the following CSS code to your assets/theme.css bottom of the file.

@media only screen and ( (max-width: 767px){
.template-product .page-content .page-width { padding: 0 0px !important;}
}

Thanks!

1 Like