Docs

[bak]

Hi

I have a global styling for my buttons where the hover color is dark blue

I have buttons which are on blue background and there I would like to achieve the following hover effect
– red background –> white background on hover
– white font –> red font on hover

[bak]

This reply has been marked as private.

[Lely]

Hi Bak,

Thank you for the link.
Please use this custom CSS:

input.wpcf7-form-control.wpcf7-submit:hover,
.custom-btn:hover {
    background-color: #fff !important;
    color: #d92b2f !important;
}

It will be automatic for the contact form 7 button because of this:input.wpcf7-form-control.wpcf7-submit:hover for normal x button please add class custom-btn on the specific button class field for this to take effect.

Hope this helps.

[bak]

That works well, thank you

for the contact form 7 button, is it a) possible to remove the shadow for hover state and b) change the font color in hover state to blue?

[Rue Nel]

Hello There,

To remove the shadow for the hover state and change the font color in hover state, please add the following css code in the customizer, Appearance > Customize > Custom > CSS

input.wpcf7-form-control.wpcf7-submit:hover {
    color: blue !important;
    box-shadow: none;
}

Hope this helps.

[Author]

Posts