2 columns shop on mobile

This support request was posted in Smart by schurkclothing

Request ID #39911 In Progress

schurkclothing January 20, 2020 at 6:06 pm
Hi,
Is it possible to get 2 columns of products on mobile instead of 1?
I tried different custom CSS codes but it won’t work.
And why i can’t change my shop page with the CSS class: .woocommerce ul.products li.product?

Juanfra Aldasoro January 22, 2020 at 1:42 pm
Hi,
Thank you for reaching out. I hope you’re doing well.
You will need to add custom styles for the mediaqueries in order to make it to two columns.
With regards to your second question, would you please share the link of your site and the page where you are trying to change that, so I can take a look?
Best,
Juan.

schurkclothing January 22, 2020 at 4:26 pm
This reply has been marked as private.
Juanfra Aldasoro January 23, 2020 at 7:57 pm
Hi,
Thanks for the follow-up.
1) You could try the following CSS:
```
@media only all and (max-width: 424px) {
    .grid:not(.js-resize):not(.grid-list) [class*='columns-']:not(.columns-1) {
        width: 50%;
    }
}
```
2) Try using .woocommerce ul li.type-product – It seems that you’re using elementor and they use their own structure with these classes.
Best,
Juan.
schurkclothing January 24, 2020 at 1:12 pm
Hi,
Both worked for me!
Thank you very much for your help, again!

Juanfra Aldasoro January 24, 2020 at 1:25 pm
Hi,
No worries 🙂
Have a nice day,
Juan.

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.