Support » Plugin: Contact Form 7 » Field border

Viewing 6 replies - 1 through 6 (of 6 total)
  • Add this to your style.css file (from the dashboard, click Appearance, Editor)

    background: #F7F7F7;

    Then, on the dashboard click Contact and select the form in question. When the form loads, surround the form code with <div id = "form_name"> and </div>. Note that you can change “form_name” to whatever you want, BUT what you use in the stylesheet MUST be the same as what you use in the <div> tag that surrounds the form code.

    You can change the #F7F7F7 hex code to whatever form background color you want. If that scares you, take a look at this <>. Mouse over the color you like and the hex code is automatically displayed.

    Good luck.

    Aha…cheers matey!

    I assume from that Aussie cheer that what I sent you worked. Great, glad I could help.

    Now, you have the responsibility of doing something helpful for someone.


    Well yes and no it worked…see here:

    Yes got background colour but it sits behind the form field white boxes?

    I want a 1px grey border around the input boxes really…bit lame Contact Form doesn’t do it automatically cause its daft having white input boxes on a white background.


    Add this to your theme stylesheet to control the border AND field background colors. Change as desired

    .wpcf7 input[type=text], .wpcf7 textarea {
    	border: 1px solid #A0A0A0;

    This should do it for you.

    Excellent, that’s better!

    Job’s a goodun!!…thanks muchly!

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Field border’ is closed to new replies.