Tagged: ,

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • May 12, 2023 at 4:36 pm #1407252
    edgeofcinema

    how do I make the mobile site show two columns?

    I tried this but it still breaks down to one column on mobile.

    @media only screen and (max-width: 330px) {
    .products-grid .product, .products-list .product {
    width: 50%;
    }
    }

    Website is http://www.haspools.com

    May 14, 2023 at 10:50 am #1407339
    Rikard

    Hey edgeofcinema,

    Please try the following in Quick CSS under Enfold->General Styling:

    @media only screen and (max-width: 330px) {
.responsive #top #main .products .product {
  margin: 0 1% 1% 0;
  width: 49%;
}
}

    Best regards,
    Rikard

    • This reply was modified 1 year, 7 months ago by Rikard.
    May 15, 2023 at 4:19 pm #1407453
    edgeofcinema

    Looks like it is still breaking to one column

    May 15, 2023 at 7:12 pm #1407470
    Rikard

    Hi,

    Please try this instead:

    @media only screen and (max-width: 480px) {
.responsive #top #main .products .product {
  margin: 0 1% 1% 0 !important;
  width: 49% !important;
}
}

    Best regards,
    Rikard

    May 15, 2023 at 7:24 pm #1407476
    edgeofcinema

    It worked! Thank you!

    May 16, 2023 at 7:41 am #1407514
    Nikko

    Hi edgeofcinema,

    I’m glad that Rikard could help you :)
    Thanks for using Enfold and have a great day!

    Best regards,
    Nikko

  • Author
    Posts
Viewing 6 posts - 1 through 6 (of 6 total)
  • The topic ‘Woo-commerce 2 colomns on mobile not working’ is closed to new replies.