Resolved3 columns on Product Listing Columns on Mobile Phones

This topic has 7 replies, 2 voices, and was last updated 1 year, 11 months ago by Althemist.

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

Author
Posts
March 24, 2021 at 2:09 am #29628
artweb.frog
Participant
Hi! There is no options available about, only two or one. I tried adding this css but it doesn’t work:
@media only screen and (min-width: 380px) and (max-width: 599px)
div.prod_hold, li.product-category, div.product-category {
width: 33% !important;
}
@media only screen and (max-width: 979px)
div.prod_hold, li.product-category, div.product-category {
width: 33% !important;
}
March 24, 2021 at 9:11 am #29637
Althemist
Keymaster
Hello artweb.frog,
I am afraid this would not be possible. There is just no enough space for 3 columns on mobiles. You can use the following selector, but on your own responsibility, as there will be no space for buttons, product titles etc. Even the images will not be visible if there is something on theme (e.g SALE or NEW label):
```
body div.prod_hold, body li.product-category, body div.product-category {
    width: 33% !important;
}
```
March 24, 2021 at 7:25 pm #29649
artweb.frog
Participant
I tried but the code doesn’t work on “customize”. Where should I put it? Ty
March 25, 2021 at 9:00 am #29667
Althemist
Keymaster
The best way would be in style.css of the child theme, but it should work fine in the customizer too.
March 30, 2021 at 1:18 am #29734
artweb.frog
Participant
Don’t know man, doesn’t work 🙁
March 30, 2021 at 3:14 pm #29760
Althemist
Keymaster
Did you used the code I gave you with BODY selector and !Important?
Please, give us a link where we can see it “live”.
April 8, 2021 at 7:30 pm #29924
artweb.frog
Participant
Sure! Check it out.
https://www.alterverso.com/
April 9, 2021 at 3:10 pm #29932
Althemist
Keymaster
There is no such style in the code. Where did you add it? Also, in the code above, it looks like you’re missing the curly brackets for the media query.
Author
Posts