Contact Form 7 - Change font-size and color of error message

When a required field is missing from the contact form, an error message is displayed that says “one or more fields are missing”. In addition, there is an error message below the field that says “This field in required.” This error message is very small and not easily recognizable.

I want to change the font-size and color of the message that says “This field is required.” I used the css below but it didn’t work. Please point me in the right direction.

div.wpcf7-validation-errors {
border: 2px solid #197695;
}

Hi @eutaw,

Thank you for reaching out to us. To change the font-size and color of the message, please add the following code in the Theme Options > CSS:

.wpcf7-not-valid-tip {
    font-size: 15px;
    color: red;
}

Here are some related links for further reading, this could help you in finding and implementing some CSS fixes:

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

Thank you so much and thanks for the links.

You’re most welcome!

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