Two Columns Widget Area on Mobile

[rendisis]

Hi,

I would like to make only the widget area become two columns instead of stack on mobile. Kindly notice that i have two rows of widget area and they already have a shortcode showing best selling and sale product on woocommerce. Can you help me on this?

Thank you.

Best,
Rendy

[jade]

Hello Rendy,

Please add this code in X > Theme Options > CSS:

@media (max-width: 480px) {
    .woocommerce.columns-4 li.product {
        width: 48%;
    }
}

Here are some related links for further reading:

• Intro to CSS - https://goo.gl/mFuWQT
• How to get CSS selectors - https://goo.gl/BmoH39
• Get Started With Viewing And Changing CSS - https://goo.gl/7xFhDa
• CSS Media Queries - https://goo.gl/L3ZHNg

Hope this helps.

[rendisis]

This is work great! Thank you!

Best,
Rendy

[thai]

Glad we were able to help you