How to change the background colour in one specific buttom

Hi,

I am trying to change the colour of the background on the button sign up to subscribe to my newsletter with it didn’t work. I have changed the CSS code to the new colours I want. I send the code I wrote:

.tco-subscribe-form-1439 .submit:hover {
color: #404040;
border-color: #404040;
background-color: #ffffff;
text-shadow: none!important;

I send you also below the page of my website where I want to make the changes:

Best regards,
Marina.

Hi Marina,

Thank you for reaching out to us. Your CSS seems correct and the selector is also right but it’s been overridden by the higher priority selectors that’s why your CSS is not applying. Try replacing your code with the following:

.tco-section .tco-subscribe-form input[type="submit"]:hover {
    color: #404040;
    border-color: #404040;
    background-color: #ffffff;
    text-shadow: none!important;
}

You can find more information on how to check for CSS selectors here and CSS Specificity here.

Don’t forget to clear all caches including your browser’s cache after adding the code. Let us know how this goes!

Hi,

Thank you for that! The problem is that the colour when hover over the button has changed but it’s didn’t changed when I don’t hover over it. Right now the colour is #722233 and I want to changed it to black.

Best regards,
Marina.

Hello Marina,

To resolve your issue, you can make use of this code:

/* Active state */
.tco-section .tco-subscribe-form input[type="submit"] {
    background-color: #000;
}

/* Hover state */
.tco-section .tco-subscribe-form input[type="submit"]:hover {
    color: #404040;
    border-color: #404040;
    background-color: #ffffff;
    text-shadow: none!important;
}

We would love to know if this has worked for you. Thank you.

Thank you so much, it worked.

Have a nice day,
Marina.

You’re most welcome!
It’s good to know that it has worked for you.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.