Display Woocommerce products in two columns on mobile

[demirstringart]

demirstringart

October 5, 2023 at 5:27 am

Hi everyone! I again have a problem displaying blocks of Woocommerce products, such as “All Products” or “Best sellersproducts”
Indeed, as for the example page that I linked, I cannot display the products in two columns when it is consulted from a mobile.

I already asked the question 8 months ago, and an answer worked :

@media (max-width: 768px) {
.wc-block-grid .wc-block-grid__products:not(.thisisforspecificity) .wc-block-grid__product, .wc-block-carousel .wc-block-grid__product {
max-width: 50%;
}
.wc-block-grid.has-4-columns .wc-block-grid__products {
display:flex;
}
.wc-block-grid.has-4-columns .wc-block-grid__product {
flex: 1 0 50%;
min-width: 40%;
padding: 0;
margin: 0 0 24px;
}
}

But for a few days (I don’t know when it started), it hasn’t worked anymore. I once again have only one product displayed on the left part of the screen, and nothing on the right part. I did some tests, and this problem only appears when the screen is 480 pixels or less. Beyond that, two products are displayed correctly. Except that most smartphones are 480 pixels……

I specify that I have not changed anything on my site, I have not added any plugins, touched the customizer etc… I just updated WordPress. Can you help me ?

Thanks for your help !

Irina