How to get 3 Multicolumns on one row for Mobile without sliding?

[Fishmoments]

Hi - is anyone able to help me, please?

I'm having trouble building the Dawn theme.

How to get 3 Multicolumns on one row for Mobile without sliding?

The page URL is

https://fishmoments.com.au/pages/fresh-seafood

Thanks in advance!!!

[Dawood_Mirza_ · Accepted solution]

No issues @Fishmoments , I got another way to get this
From Customizer > select your Multicolumn section > Custom CSS

Add this code

@media screen and (max-width: 749px) {
  .grid__item {
    width: 25%;
    min-width: unset;
  }
}

If you have multiples such sections add this to all those

Hope it works
BR 

Dawood Mirza

[Dawood_Mirza_]

Hi @Fishmoments,

From your Shopify admin dashboard, click on "Online Store" and then "Themes".

Find the theme that you want to edit and click on "Actions" and then "Edit code".

In the "Assets" folder, click on "component-slider.css" file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:

@media screen and (max-width: 749px){
.grid--peek .grid__item {
width: 33%;
min-width: unset;
}
}
adjust width % is creates design error

And Save.

Please don't forget to Like and Mark Solution to the post that helped you.

BR

Dawood Mirza

[Fishmoments]

Hello, Dawood!

First of all, thank you very much for your quick reply to my question.

I've followed your steps, but it seems doesn't work.

The page works the same as before. Nothing has changed, even though I have re-dragged the Multicolumn section.

Am I missing something, or is there an error in the operation?

Very much looking forward to you replying again.

[Dawood_Mirza_ · Accepted solution]

No issues @Fishmoments , I got another way to get this
From Customizer > select your Multicolumn section > Custom CSS

Add this code

@media screen and (max-width: 749px) {
  .grid__item {
    width: 25%;
    min-width: unset;
  }
}

If you have multiples such sections add this to all those

Hope it works
BR 

Dawood Mirza

[Fishmoments]

Thank you @Dawood_Mirza_ 

Now they're exactly on one row for Mobile without sliding.

Yet they were so small that it was difficult to see them clearly.

Their spacing is very different from the spacing in your screenshot.

Is there anything else I can do to optimize it?

Thanks again for your reply.

[Dawood_Mirza_ · Accepted solution]

Ok, 
Try these settings it they work, or else I will give you code

[Fishmoments]

Aha. That's great!
That's what I wanted.

Thank you very much for your guide.