related products on Mobile

[jbordersfl]

after the update… at the bottom of product pages, the related items thumbs/links are 1/4 width even on mobile, and they’re so small that the text block that tries to show at the bottom blocks half the thumbnail.

i believe these used to b just 2 across on mobile instead of 4. is there a fix for this. as it looks bad and is unusable right now.

thank you

Attachments:

You must be logged in to view attached files.

[Rui Guerreiro – SUPPORT]

Hi,

Do you any custom css?
Can you try to turn of all plugins except Woocommerce?

Clear the mobile cache and try again.

-Rui

[jbordersfl]

this is not a plugin issue, or an issue specifically with mobile device or cache.

even in firefox on desktop window sized down to mobile size, firebug tells me that the div is set at 22%, which would be 1/4 of the device width. this appears to be on line 828 of “responsive.css” see attachment.

Attachments:

You must be logged in to view attached files.

[Mohammad – SUPPORT]

Hi,
Please use this custom css code:-

@media only screen and (max-width: 479px) {
div.carousel-overflow ul#products.products li.product{
width:100% !important;
}
}

Thanks
Mohammad

[jbordersfl]

thanks that works and is better, thank you. still would prefer the way it was, which i believe was 1/2 page on mobile (2 items per row). i tried setting the width to 45%, but the right margin always makes the second item bump to the next row. if you have an easy fix for that it’d be appreciated.

[Mohammad – SUPPORT]

Hi,
Please remove last css code and use this new css code:-

@media only screen and (max-width: 479px) {
div.carousel-overflow ul#products.products li.product{
width: 48%;
margin: 0px 3px 0px 2px !important;
}
}

Thanks
Mohammad

[jbordersfl]

that’s seems to work, thank you.

[Mohammad – SUPPORT]

Hi,
You most welcome and i am glad that your issue resolved.
Thanks
Mohammad