Mobile products 2 columns

[andreafabbri]

Hi,
How do I display products of the home in two columns?
currently-is so:

Thanks

[Rui Guerreiro – SUPPORT]

Hi,

Can you provide the link to that page?
Thanks

-Rui

[andreafabbri]

This reply has been marked as private.

[andreafabbri]

were you able to get?

[Kyle – SUPPORT]

Hi

Try this:

@media only screen and (max-width: 479px) { 
.owl-carousel .owl-item {
  width: 160px!important;
}
}

And remove:

.woocommerce .products .product.col-sm-sf-5 {
  float: left;
  width: 50% !important;
}

– Kyle

[andreafabbri]

This reply has been marked as private.

[Kyle – SUPPORT]

Did you remove this?

.woocommerce .products .product.col-sm-sf-5 {
  float: left;
  width: 50% !important;
}

– Kyle

[andreafabbri]

We’re almost there, but now the carousel seems endless

[Kyle – SUPPORT]

What makes you say that? Can you explain?

– Kyle

[engzhaowei]

Hi,

I am encountering the same problem with the carousel. I think what the user meant by endless should be the same problem as shown in the screenshot attached.

The code display 2 products in a single row nicely. However, after scrolling through all the products in the carousel, there seems to be another blank space.

Please feel to test my site on mobile view to understand better what i meant.

http://beautesenz.com/test/

Attachments:

You must be logged in to view attached files.

[David Martin – Support]

@engzhaowei – what theme version and what version of the Swift Framework do you have?

Please amend your code to this:

@media only screen and (max-width: 479px)
.owl-carousel .owl-item {
    max-width: 185px;
}
}

Thanks.