WordPress.org

1. kuran
   Member
   Posted 5 months ago #

   I'm very happy having found out about Contact Form 7, and have been able to style it pretty well so far.

   However I can't figure out how to style all the elements of the [response] element.

   div.wpcf7-validation-errors is seemingly only for the output which tells you what is wrong with the form.

   But how do I style the red boxes that appear over the form fields to indicate the source of the error(s)?

   PS: I am using watermark on my fields, but this doesn't seem to work with the CAPTCHA tag, as the watermark text simply gets treated as a default value.

   PPS: How do I style the selection color that appears around my form fields when clicked?

   Thanks for any help!

   http://wordpress.org/extend/plugins/contact-form-7/

2. kuran
   Member
   Posted 5 months ago #

   Is this talking about my subject?

   http://wordpress.org/support/topic/plugin-contact-form-7-altering-the-required-field-pop-ups

   When I edit span.wpcf7-not-valid-tip, none of the changes are registered. Except for adding display:none to the CSS.

   Border color, text color, padding values are all ignored and I get a standard long, white error message overlay with red borders and no text inside.

3. Takayuki Miyoshi
   Member
   Posted 5 months ago #

   Try div.wpcf7-response-output or div.wpcf7-mail-sent-ng.

4. kuran
   Member
   Posted 5 months ago #

   Thanks for the response Takayuki, I appreciate it!

   I think I figured out what went wrong, because I did not want to mess with the plugin's default CSS (since I might want to use it with another future theme), I decided to copy the CSS values to my theme's style.css document. This seemed to work with the one of the values I tested it with, but it was causing conflicts and my changes wouldn't override the original styles.css.

   I hope that explanation makes sense.. :)

   I'll change the thread to resolved as soon as I manage to style the error messages properly..

Reply

You must log in to post.