Button CSS

  • Resolved Jay Goodrich

    (@jaygoodrich)


    7 years, 2 months ago

    Hello,

    I need some CSS advice… I want to change the corners of the buttons to square instant of 4px rounded ones. When I add the button CSS that I found related to the page to my WP Custom CSS, nothing happens though when targeting it in my browser it works. Any suggestions?

    The page I need help with: [log in to see the link]

Viewing 7 replies - 1 through 7 (of 7 total)
  • Mike W

    (@nixiack8)

    7 years, 2 months ago

    Hi @jaygoodrich,

    I want to change the corners of the buttons to square instant of 4px rounded ones. When I add the button CSS that I found related to the page to my WP Custom CSS, nothing happens though when targeting it in my browser it works.

    I checked your page that you mentioned, and I did not see the PayPal buttons on there. Checking the Cart page I did see the button. You can try this CSS to see if it works, under Appearance > Customize > Additional CSS:

    .paypal-button.paypal-button-color-gold:hover, .paypal-button.paypal-button-color-silver:hover {
  border-radius: -10px;
}

    You can adjust the radius to 0 or more if needed. Please let me know if this works! I was able to get the buttons to look square.

    Thread Starter Jay Goodrich

    (@jaygoodrich)

    7 years, 2 months ago

    Same happened for me. It worked when I tested the change in my browser but when I implemented it in the Custom CSS, again, no change. It’s like the CSS is being blocked.

    Plugin Support John Coy a11n

    (@johndcoy)

    Automattic Happiness Engineer

    7 years, 2 months ago

    Hi @jaygoodrich

    Try adding !important to CSS that does not appear:

    .paypal-button.paypal-button-color-gold:hover, .paypal-button.paypal-button-color-silver:hover {
    border-radius: -10px !important;
    }

    Hope that helps.

    Thread Starter Jay Goodrich

    (@jaygoodrich)

    7 years, 2 months ago

    Hi John,

    I tried that as well and it didn’t work. I am stumped.

    Jay

    Plugin Support John Coy a11n

    (@johndcoy)

    Automattic Happiness Engineer

    7 years, 2 months ago

    Hi @jaygoodrich

    You may want to contact your theme author at this point as it’s likely that the theme is forcing a specific styling. You can share with them our suggestions to maybe help along the way.

    Thread Starter Jay Goodrich

    (@jaygoodrich)

    7 years, 2 months ago

    I personally don’t think it’s a theme issue, but have sent them an email. I have added CSS to square all the corners of all the buttons on the cart page and within Woo with zero issue. It’s like PayPal is overriding the CSS from their level or something.

    Plugin Support John Coy a11n

    (@johndcoy)

    Automattic Happiness Engineer

    7 years, 2 months ago

    Hi @jaygoodrich

    You’re right, you’d have to use JavaScript to apply the override since it’s PayPal’s scripts that are applying the styles after the page loads. This will require customizations that we cannot help with here.

    We recommend one of the services listed on this page who can assist with any custom development work:

    https://woocommerce.com/customizations/

Viewing 7 replies - 1 through 7 (of 7 total)

The topic ‘Button CSS’ is closed to new replies.