show more than one product per row in mobile responsive

Should be very, very easy with some simple css changes.

This will be quite unique to your website, but as an example, this is what I have on one of mine that has a 2 products per row mobile layout –

ul.products li.product {
text-align: left;
position: relative;
list-style: none;
width: 48%;
float: left;
}

ul.products li.product:nth-child(2n) {
float: right;
}

There must be an easier way to do this. Is there a plugin?

You’re changing the layout, so CSS is the correct way. Even if there were a plugin, I highly doubt it would work with all themes in existence.

If your theme already has responsive CSS styles, these can be adjusted. WC core for mobile makes things 100% width 1 column due to the limited space.

If you need help with customisation or you’re not comfortable with modifying the theme or CSS code, consider jobs.wordpress.net for someone who is.

I am using divi theme and i created a website https://www.anokhafashion.com
I added 3 products in a row but in mobile version it is showing only one product per row. I want 2 product per row please help.

I used this code from stackoverflow, and it works perfect:

@media all and (max-width: 480px){
.woocommerce .products li.product {
width: 50% !important;
}
}

here is the link: https://stackoverflow.com/questions/41875930/woocommerce-change-single-product-per-row-to-multiple-mobile-responsive

Hi guys. I tried all of the solutions mentioned in this forum and yet to have any success! Could someone please take a look at my page and recommend a fix?

https://www.meetmarina.com/how-not-to-be-basic/

REALLY APPRECIATE YOUR HELP.

Best,

RK