specialdale

@Lesum wonderful, thank you!! That worked, and I altered the code a bit so the related product sizes on desktop view would still be smaller, in a row of 4 columns. In case it helps anyone else, here it is-- @media only screen and (max-width: 767px) { #pdp .ProductItem-relatedProducts .list-grid { grid-template-columns: 1fr 1fr !important; grid-column-gap: 10px !important; grid-row-gap: 10px !important; } }

Here's how the related products look in mobile currently, they just scroll right off the screen:

Hi, I've added CSS to make my related products smaller on my product pages, but now they go off the screen in mobile. So my question is how to get the related products to wrap in mobile? Any suggestions appreciated! greenhillforge.com/shop password: shop Here's the code I'm using to make my related products smaller: //related products grid size// .ProductItem-relatedProducts .list-grid {grid-template-columns: 200px 200px 200px 200px !important; font-size: .75rem; line-height: 2rem; } Thank you!

Amazing, that worked! Thank you

Hi, I'm trying to decrease the size of the categories font on my shop page. I've already combed thru the forums and tried several different custom CSS codes but for some reason none of the solutions are working for me... The page is https://www.greenhillforge.com/shop and the password is shop. Appreciate any suggestions!