How to display 4 collections in collection list section only in mobile version?

Shopify Discussion
1

URL is www.ahly.com.au

how to display 4 collections in collection list section in mobile version?

and display each collection picture as 16:9?

Below screenshot is collection list section but it only display one collection each time and picture is square.

is that possible to display 4 collections each time and each collection picture size is 16:9?

aus10188_0-1648092787854.png
aus10188_0-1648092787854.png431×638 204 KB

thanks

cecilia

2

@aus-10188 ,

Share the store URL.

3

www.ahly.com.au

thanks

4

@aus-10188 ,

@media screen and (max-width: 749px)
.collection-list .collection-list__item {
    width: calc(33% - 3rem);
}

Add this css at the bottom of Online Store->Theme->Edit code->Assets->base.scss.liquid

5

Hi,

it doesn’t work. can you please check for me? really appreciate your help!

6

@aus-10188 ,

If you have already this media @media screen and (max-width: 749px) then add the css in it.