How can I adjust the size and alignment of items in my collection list?

[b0sw0rth]

Hi, my website is https://www.bannershallmark.com/

I'm having an issue where when I reduce the number of items in the collection lists on my front page (titled "browse by category" and "shop bestsellers"), the items remain the same size and are justified to the left of the page. Ideally I would like the fewer (lets say 4) categories to grow larger and fill the space, while being centered on the page. Or if there are lets say 8 categories, there would be two rows of 4 large category thumbnails. Is there any way I can make that work?

A perfect example of what i'm looking for is here at https://trudyshallmark.com/

Thank you!

[shreyhweb]

@b0sw0rth 

Hello

Please add below code above </body> in theme.liquid

online store >> edit code >> theme.liquid

<style>
@media screen and (min-width: 768px) {
.new-grid .grid-item {
flex: 0 0 25%;
}
.new-grid.product-grid .grid-item.grid-product {
flex: 0 0 20%;
}
}

</style>

after added looks like this

We hope the given code helpful. if this code is helpful for you then please like the post and tap on accepted.

you discuss any further information related with shopify then you can contact us

Thankyou,