Return to previous page

Global CSS for Padding on Products Titles on Mobile Breakpoint

This topic has 3 replies, 2 voices, and was last updated 2 years ago ago by slippery

slippery

Participant

November 23, 2022 at 00:20

Hello,

Due to the limitations of WordPress/Elementor, I had to create unique Single Product Pages for every product and somehow, the titles look incorrect on the mobile breakpoint.

Instead of adding padding to every Single Product Page, I was hoping I could simply add some global CSS for padding (10px) that affects the WooCommerce Product Title on mobile.

Looking forward to your help.
Thank you.

Please, contact administrator
for this information.

#339298 Copied Theme version: 8.3.7

2 Answers
Rose Tyler

Support staff

November 23, 2022 at 05:51
Hello,

Add the next code in Theme Options > Theme custom CSS > Global:
```
@media(max-width:763px){
    .single-product .product_title {
         padding: 0px 10px; 
    }
}
```
Regards
#339319 Copied
slippery

Participant

November 23, 2022 at 12:30

Thank you, you’re a legend!

#339361 Copied
Tagged: global, mobile breakpoint, padding, products titles, woocommerce, wordpress themes
Viewing 3 results - 1 through 3 (of 3 total)

The issue related to '‘Global CSS for Padding on Products Titles on Mobile Breakpoint’' has been successfully resolved, and the topic is now closed for further responses

Global CSS for Padding on Products Titles on Mobile Breakpoint

Recent Topics

Helpful Topics

Useful links WooCommerce & WordPress

Browse by popular tags:

Explore our best WordPress WooCommerce Themes collection