How can I display two product columns on mobile with Flex version 3.0.0?

[eneskbm]

Hello,

Currently we are using Flex version 3.0.0 by Out of the Sandbox and there is only one product per row on mobile on collection pages. I would like to have 2 products per row so 2 columns. I changed it from 1 to 2 in the screenshot below but it didn’t work. The products placed to the left and got smaller but still 1 product in one row.

Why is it like that and how can I fix it? Could you please help me?

Our websites are:

https://kismetbymilka.com.tr/

https://kismetbymilka.com/

Thanks!

[BSS-Commerce]

Hi @eneskbm

Please follow these steps:

Navigate to Online store > Themes > Edit Code. Then find the file named “styles.css”. Scroll down to the bottom and add this code:

@media only screen and (max-width: 480px)
.equal-columns--outside-trim .small-down--one-whole:nth-of-type(1n+1) {
    width: 50%!important;
}

This is the result:

I hope that it will work for you.

[GemPages]

Hello @eneskbm

You can follow these steps:

1. Go to Online Store->Theme->Edit code

2. Open your theme.liquid file, paste the below code before

I hope the above is useful to you.

Kind & Best regards,
GemPages Support Team