How can I display 4 collections per row on the Dawn theme homepage?

[MikeBaguyo]

Hi! Is there a way where I can have 4 collections per row in the "Collection List" part on my home page? I'm using Dawn theme, it's like this when I have 4 collections:

However, when there are only 3 collections, they are in a single row, but once I add a collection, cause I have 4, it goes like this, only 2 collections per row, I want it to be in a single row only and a smaller size if possible.

My store: chrisandleon.com

[dmwwebartisan]

@MikeBaguyo 

Please share your store URL & stroe front password.

Thanks!

[MikeBaguyo]

chrisandleon.com

[dmwwebartisan · Accepted solution]

@MikeBaguyo 

 Please try this code 1. Go to Online Store->Theme->Edit code 2. Asset->/section-collection-list.css-->paste below code at the bottom of the file.

@media screen and (min-width: 750px){
 .collection-list--4-items .grid__item {
    width: 25% !important;
}
}

[MikeBaguyo]

It worked! Thank you so much!

[dmwwebartisan]

@MikeBaguyo 

Thanks! welcome again.

[VSLV22]

I have the same exact problem. I have the Dawn theme, on the homepage, collection list - I have 4 collections (images). I would like to change the giant images to regular size thumbnails and most importantly have 4 collection images in 1 single row.

The code you responded does not work for me. When I enter the code, it gives 3 smaller images on 1 row and the 2nd row has 1 giant image. 

I'm looking for 4 smaller images on 1 row. Thanks.

[blackdogfarmmt]

I am having the same problem. The code above gives me 3 smaller images on the first line and one giant one on the second line. 

[envisionws]

Use this: 

@media screen and (min-width: 750px){
.collection-list--4-items .grid__item {
width: 20% !important;
}
}

[MikeBaguyo]

Updated my store url 🙂