Global CSS for Padding on Products Titles on Mobile Breakpoint

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

  • Avatar: 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.
    2 Answers
    Avatar: Rose Tyler
    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

    Avatar: slippery
    slippery
    Participant
    November 23, 2022 at 12:30

    Thank you, you’re a legend!

  • 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

We're using our own and third-party cookies to improve your experience and our website. Keep on browsing to accept our cookie policy.