Button Color Hover - WPBakery Builder

[Mittavalleybeef]

Hi there,

I can’t find the thread that solved the similar situation to mine.

I have been trying to change the button hover color but failed to do so.

I am using WPBakery Builder. They have different default colour but I could change the button colour from grey to the desire one. But I can’t change the hover colour. I have changed in the web developer tool from the browser which was fine and copied the rule to paste in Custom CSS of the WPBakery but it failed to change. I also tried with !important but it didn’t work.

.vc_btn3.vc_btn3-color-grey.vc_btn3-style-modern:focus, .vc_btn3.vc_btn3-color-grey.vc_btn3-style-modern:hover {
color: #ffffff !important;
border-color: #d80f0f !important;
background-color: #d80f0f !important;
}

Thanks

[marc_a]

Hi @Mittavalleybeef,

Thanks for reaching out!

Would you mind sharing the page URL where your button is available? In that way, we can give you a piece of advice on how you can add a hover state to your buttons.

Cheers!

[Mittavalleybeef]

Hi there,

I’ve saved the URL and credentials in the secure note in case if you might need to log in.

Looking forward to hearing your suggestion.

Thank you.

[tristup]

Hi @Mittavalleybeef

I have checked your website and found the URL where the button is placed. After investigating the button classes, it has been found that you might have used the wrong parent class selector. The correct CSS code looks like the following.

.vc_btn3-style-modern:focus, 
.vc_btn3-style-modern:hover 
{
    color: #ff0000 !important;
    border-color: #d80f0f !important;
    background-color: #d80f0f !important;
}

Please remember that the above code will work if copied as it is and doesn’t conflict with any existing style.
Please note that the code provided serves only as a guide to help you get started custom coding on your own if there’s no option offered in our theme or the products we bundle.
We really do not provide support for custom codes that means we can’t fix it in case it conflicts with something on your site nor will we enhance it.

Thanks