Set 5 columns, get 4

Viewing 3 replies - 1 through 3 (of 3 total)

  • If I set it to 5 I get 4 in the first row and 1 ind the 2. row
    4 in the 3. and 1 in the 4. row etc etc.

    If I choose 4 I get 2 and 1 – 2 and 1 etc.

    It only works with 2 ?? ??

    There is something wrong there.

    Looks like they need to update CSS.

    To make 4 columns into 3, I had to add this CSS:

    /* Fix up 3-products-per-line */
.woocommerce ul.products li.product:nth-child(4n+1), .woocommerce-page ul.products li.product:nth-child(4n+1) {
    clear: none;
}

.woocommerce ul.products li.product:nth-child(4n), .woocommerce-page ul.products li.product:nth-child(4n) {
    margin-right: 1.818181818181818%;
}

@media only screen and (max-width: 1100px) {
    .woocommerce ul.products li.product:nth-child(4n), .woocommerce-page ul.products li.product:nth-child(4n) {
        margin-right: 2.947368421052632%;
        width: 30.75%;
    }
}

@media only screen and (max-width: 600px) {
    .woocommerce ul.products li.product:nth-child(4n), .woocommerce-page ul.products li.product:nth-child(4n) {
        width: 48.33333333333333%;
    }
}

    @agilisit

    Great CSS work on 3 columns setting
    but i really need css for 2 columns setting…

    can you manage that…
    really appreciate

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Set 5 columns, get 4’ is closed to new replies.