Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #404386

    Hello guys,

    I’m struggling with the following issue: when I assign a certain page as the ‘Shop Page’ with Woo, products are not displayed correct on mobile devices. Also, the Enfold grid is disordered (in my case: icon boxes). On mobile, products should show as 100% width, as should the icon boxes, but keep being respectively 25 en 33%.

    I know that it would be easier not to assign any page as the shop page, but I need to, because it’s important to be able to filter the products.
    Therefor, I user WC Products Filter and this is only working with the Woocommerce displayed products.

    I could change everything in my css, but it seems to me that there is a css conflict and I can’t find it.
    Any thoughts on this subject?

    Thanks!

    #404788

    Hey Thomas!

    Try adding this to your custom CSS.

    @media only screen and (max-width: 479px) {
    .post-type-archive-product div .av_one_fourth, div .av_one_third { margin-left: 0px !important; width: 100% !important; }
    }
    

    Best regards,
    Elliott

    • This reply was modified 9 years ago by Elliott.
    #405050

    Hello Elliot,

    Thanks. This is indeed a fix, but I still don’t get what’s causing this problem.

    Any thought on this subject?

    #405580

    Hey!

    Not sure to be honest, did Elliotts code fix your problem though?

    Cheers!
    Rikard

    #406331

    Hello Rikard,

    As I stated in my first post, I know how to change it in the css. So my question remains unanswered.

    Thanks for your effort anyway!

    Thomas

    #406362

    Hi!

    CSS conflicts happen all the time unfortunately, especially with plugins, but Elliotts code did work as intended, correct? If it works I wouldn’t give it too much thought, unless you have some other reason for knowing?

    Best regards,
    Rikard

Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.