How can I create three rows with multicolumn on mobile?

[lukkaa]

Hey, thanks for the help, i need to make multicolumn 3 rows for mobile - the 6 icons below hero image, i want them to be 3 - 3 in row for mobile ! Thanks and site is :

eonimo.com

[zaczee]

Hi @lukkaa ,

Add this CSS code

Online Store > Themes > Edit code > Assets > custom.css or theme.css

@media screen and (max-width: 749px) {
  .grid--2-col-tablet-down .grid__item {
    width: 29% !important;
}
  .multicolumn-card__image-wrapper--third-width { width: 70%}
}

[lukkaa]

Thanks it worked but now icons are too small, can they be bit larger somehow to fill in the space around ? thank you so much !

[PageFly-Richard · Accepted solution]

Hi @lukkaa ,

This is Richard from PageFly - Landing page builder, I’d like to suggest this idea:
Step 1: Go to Online Store->Theme->Edit code
Step 2: Asset->/section-multicolumn.css->paste below code at the bottom of the file:

@media screen and (max-width: 749px) {
  .multicolumn-card__image-wrapper--third-width { 
      width: 80% !important;
    }
}

I hope it would help you
Best regards,

Richard | PageFly