How to adjust margin of Related Product section

[Aki_TW]

Hi

I have created a related product section by referring below article.

https://gist.github.com/carolineschnapp/1002801

But the actual layout that came out by my coding looks like below. So some parts of the product grid do not look responsive layout. 

https://gyazo.com/521404fb909a4ccd6fb58ad2a3b73055

Could anyone advise me how to fix this layout?

Store link: https://ojf2ku0yzt7bkm77-57894207664.shopifypreview.com

Them: Supply

The product that comes with the related product grid: https://ojf2ku0yzt7bkm77-57894207664.shopifypreview.com/products/test-2

Many thanks

[ZestardTech · Accepted solution]

Hello There,

1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset >theme.scss.css and paste this at the bottom of the file:

@media screen and (max-width: 749px){
div#shopify-section-product-recommendations aside.grid .grid-uniform {
margin-left: 0;
}


div#shopify-section-product-recommendations aside.grid {
margin-left: 0;
}

div#shopify-section-product-recommendations aside.grid .grid-uniform .grid-item {
padding-left: 15px;
}
}

[Aki_TW]

Hi Pallavi

Thank you so much! It works well!

[ZestardTech]

Thank you for your response. It's good to know that it's worked for you. Kindly feel free to get back to me if you need any further assistance.