make collection list images smaller on mobile

hello, i would like to make my collection list images smaller on mobile:

this is my website, i would like it to look something like this:

my website is www.marcomontesi.com , password is chasha , dawn theme

Hey @ads18922 this is Qasim a Sr. Shopify Developer and Official Shopify Partener.

In order to make collection image smaller on mobile then please paste this code in the end of component-slider.css file.

@media only screen and (max-width: 767px){
.collection-list-wrapper.page-width slider-component.slider-mobile-gutter ul.collection-list li{
width: 40% !important;
}
}

If this was helpful please mark as Solution and like it.

Hi Ads18922

  • You can try to follow this step
    Step 1: Go to Edit code
    Step 2: Find file component-slider.css and add this code at the end of the file
@media (max-width: 746px) {
  .collection-list-wrapper.page-width slider-component.slider-mobile-gutter ul.collection- 
   list li {
    width: 50%;
  }
}

Result:

Best,
Esther