MOBILE – Images on single product page under the menu
-
Hello,
1) Only on mobile device, I have a problem with the images following under the menu as you see in the screenshot attached.
I dont have the problem on desktop view :
https://easybeer.shop/produit/best-bitter/
2) Also, on the opposite, on desktop view, the product etiquette/label (-13% promo) are too small on the single product page… how can make it bigger on desktop only ?
https://easybeer.shop/produit/best-bitter/
Thanks a lot
Florian
Attachments:
You must be
logged in to view attached files.
Hello,
Please try using the below Custom CSS code and paste it to Dashboard >> Theme Settings >> Custom CSS >> Custom CSS for mobile section:
.woocommerce-product-gallery .woocommerce-product-gallery__image {
top:20px;
}
.single-product, .product-label.onsale.product-label.onsale {
top: 10px !important;
position: relative;
}
02.Please try using the below Custom CSS code and paste it to Dashboard >> Theme Settings >> Custom CSS >> CSS for Desktop:
.product-label.onsale {
min-width: 100px;
height: 40px;
font-size: 30px;
}
Best Regards.
Hello,
Thanks a lot.
It worked but it had one side effect : the etiquettes are under the % sale as you see in the attached file.
2) Also, is it possible to modify the police size of etiquettes/attribute and sale etiquette ONLY on the single product page ? (is it too small on this page only)
Thanks,
FLorian
Attachments:
You must be
logged in to view attached files.
Hello,
01.Please try using the below Custom CSS code and paste it to Dashboard >> Theme Settings >> Custom CSS >> Custom CSS for mobile section:
.product-label.attribute-label:not(.label-with-img) {
margin-top: 10px !important;
}
02.Please try using the below Custom CSS code and paste it to Dashboard >> Theme Settings >> Custom CSS >> CSS for Desktop:
.single-product .product-label.attribute-label:not(.label-with-img) {
width: 100px ;
height: 50px;
font-size: 15px;
}
Best Regards.
.
