Gaps between products after changing number of products per row Brooklyn

New Member
1 0 0



I'm hoping someone can help me out with this problem that I can't seem to figure out --


I'm on the Brooklyn theme and I edited the product-grid-item liquid so that I'd get 2 products per row on mobile, and 5 products per row on desktop. The problem is.... everything looks great on desktop, but for some reason I get gaps between the product listings on mobile. I went back and re-uploaded the product images to make sure they're all 800x800, but the problem still persists. I've included the code below. If you need PW access let me know :)






The code is now: <div class="grid__item grid-product one-half medium--one-quarter large--one-fifth{% if sold_out %} is-sold-out{% endif %}">

  <div class="grid-product__wrapper">


This was previously was {{ grid_item_width }} but changed to be able to show 2 items in a row in mobile and 5 items in a row in desktop)

New Member
2 0 0

Did you get a solution to your problem.

If so please share.


Thank you