prevent image resize when only a single product in Collection

Hi, I’m using Spotlight theme, and one of my collections only has a single product, but when i remove the other default blocks in the Collection to only the one, it automatically maximises the image size to full width.

All of my other collections are set to 5 columns so i want to make my collection with the single product the same image size as those.

https://sakanaproducts.com/

Hi @Sakana

You can do that by adding this css code at the bottom of your base.css file in Online store > Themes > Edit code > Assets

.collection-list .collection-list__item:only-child {
    width: calc(20% - var(--grid-desktop-horizontal-spacing) * 4 / 5);
    max-width: calc(20% - var(--grid-desktop-horizontal-spacing) * 4 / 5);
}

Amazing, it worked! thank you so much!!

1 Like

You are very welcome