Return to previous page

Reduce Size of New and sales label on mobile device

This topic has 6 replies, 4 voices, and was last updated 9 years, 9 months ago ago by Robert Hall

Kelly

Participant

February 2, 2015 at 17:45

Hi,

On Single Product Page, under the related product section, the product carousel, the sales and new label is too big and have covers the model’s face. It happen when the mobile screen width is between 768 to 974.
Please see my url in private content.

Could you let us know how to reduce the size of the label for mobile devices with width between 768 and 974?

Thank you!

Please, contact administrator
for this information.

#38903 Copied

5 Answers
Eva Kemp

Support staff

February 2, 2015 at 19:06
Hello,

Please try to add this code in custom.css file:
```
@media (max-width: 768px) { .type-label-2, .type-label-1 {
    width: 50px;
    height: 50px;
}
.type-label-2 .sale, .type-label-1 .new {
    padding: 0px 0px;
    margin-top: 18px;
}}
```
How to create custom.css you can watch in this tutorial (it’s for Legenda theme but the process is the same).

Thank you.
Regards,
Eva Kemp.
#38935 Copied
Kelly

Participant

February 4, 2015 at 16:19

Hi,

I have pasted the codes to custom css. It is still not same. Product Images covered by Sale and New label tag. Please help.

Thanks!

#39767 Copied

Eva Kemp

Support staff

February 4, 2015 at 16:58

Hello,

As I see the icons are shown fine, not covering the models faces:
http://i.imgur.com/HvmJn6N.png

Could you please show a screenshot of your page?

Thank you.
Regards,
Eva Kemp.

#39779 Copied

UrbnDesignz

Participant

February 4, 2015 at 19:42

Hello guys, my question is that my categories aren’t clickable when the website is viewed mobile. as well as the different variation in sizing for the products.

Private user log for my website.

Thank you

Please, contact administrator
for this information.

#39822 Copied
Robert Hall

Support staff

February 4, 2015 at 19:49
Hello @UrbnDesignz,

Please add this code into custom.css file.
```
.main-products-loop{
position:inherit;
}
```
Regards,
Robert Hall.
#39826 Copied
Viewing 6 results - 1 through 6 (of 6 total)

The issue related to '‘Reduce Size of New and sales label on mobile device’' has been successfully resolved, and the topic is now closed for further responses

Reduce Size of New and sales label on mobile device

Recent Topics

Helpful Topics

Useful links WooCommerce & WordPress

Browse by popular tags:

Explore our best WordPress WooCommerce Themes collection