view two colums of products in mobile

Viewing 2 replies - 1 through 2 (of 2 total)
  • Thread Starter abdull85

    (@abdull85)

    if you see the website, the first product it should display 6 culms but right now it displays 4 coz of the added CSS

    Job a11n

    (@jobthomas)

    Automattic Happiness Engineer

    Hey @abdull85 – I haven’t tested your CSS, but just looking at it, my guess is that it’s not working great because it’s not wrapped in media queries.

    Could you instead try the following? This will make that the different sizes only display if the width isn’t too wide.

    @media (max-width: 768px) {
  site-main ul.products li.product {
    width: 46.411765%;
    float: left;
    margin-right: 5.8823529412%;
  }

  .site-main ul.products li.product:nth-of-type(2n) {
    margin-right: 0;
  }
}
Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘view two colums of products in mobile’ is closed to new replies.

Tags