Hi All - Happy New Year! I’m trying to figure out how to decrease the spacing of the photos in my product grid as the attachment shows below from the first photo to the second. Could someone please help me? My website is www.noenddenim.com - thank you so much!
Topic summary
A user seeks help reducing spacing between product photos in their grid layout on a Reformation theme Shopify store. They provide before/after comparison images showing the desired tighter spacing.
Another user provides a quick CSS solution:
- Navigate to Online Store > Themes > Actions > Edit Code
- Open Assets > app.css
- Add custom CSS targeting the product grid with reduced padding (3px left and right)
The original poster confirms the solution works immediately. The discussion appears resolved with a straightforward CSS customization that addresses the spacing issue without requiring theme modifications.
@noend , do this tofix it in 20 seconds:
- In your Shopify Admin go to: online store > themes > actions > edit code
- Find Asset > app.css and paste this at the bottom of the file:
[data-id*='product-grid'] > *{
padding-left: 3px !important;
padding-right: 3px !important;
}
If it helps you please click on the “like” button and mark this answer as a solution!
Thank you.
Kind regards,
Diego
1 Like
Thank you so much! It works right away!