two columns in mobile

[kamhang]

In woocommerce, how can i set 1.category page shows two columns in mobile 2.sub-category page shows two columns in mobile 3.tag page shows two columns in mobile

[Diana]

@kamhang, Please share the pages link here so that we can share site specific CSS if possible

[kamhang]

This reply has been marked as private.

[Diana]

This reply has been marked as private.

[kamhang]

This reply has been marked as private.

[Diana]

@kamhang, Okay, so you are not creating any page. Then Please try this Custom CSS @media(max-width:600px){ .archive.woocommerce-page ul.products{ display: grid; grid-template-columns: auto auto auto; } } looks like this: https://prnt.sc/s3a924

[kamhang]

Hi Diana, I tried, as the screen you posted, it shows two columns in first row and  three columns in second row. Any idea how to set ALL rows to two columns?

[Diana]

@kamhang, Then this will work instead of above one @media(max-width:600px){ .archive.woocommerce-page ul.products{ display: flex; flex-wrap: wrap; } .archive.woocommerce-page ul.products li{ flex: 1 1 80px !important; } } refer: https://prnt.sc/s4jwwk

[kamhang]

Hi Diana, I added, still no luck. would you please check again.

[Jackson]

Hello @kamhang, Please go to wplms >>footer>>google analytics code and paste this code here this will work definitely:   <style> @media(max-width:600px){ .archive.woocommerce-page ul.products li{ display: grid !important; grid-template-columns:1fr 1f !important; width:50% !important; position:relative !important; float:left !important; } } </style> Thanks,

[kamhang]

Hi Jackson, It works, you can close this thread. Thanks

[Diana]

@kamhang, Thanks on his behalf. Closing this thread

[Author]

Posts