Impossible to style a textarea generated by a WordPress contact form plugin!

In this page, I’m trying to style a textarea generated by Contact Form 7, but it doesn’t matter what I do I can’t.

code:

Read More

CSS:

.wpcf7-form input, #wpcf7-form textarea {
    border-color: #808080 #C0C0C0 #C0C0C0 #D4D4D4;
    border-style: solid;
    border-width: 1px;
    margin: 0 400px 10px 0;
    padding: 5px;
    width: 350px;
}
#wpcf7-form textarea {
    margin: 0 400px 20px 0;
}

HTML:

                <div class="wpcf7" id="wpcf7-f1-p2-o1"><form action="/wordpress/?page_id=2#wpcf7-f1-p2-o1" method="post" class="wpcf7-form">
<div style="display: none;">

<input type="hidden" name="_wpcf7" value="1" />
<input type="hidden" name="_wpcf7_version" value="2.3.1" />
<input type="hidden" name="_wpcf7_unit_tag" value="wpcf7-f1-p2-o1" />
</div>
<p>Your Name (required)<br />
    <span class="wpcf7-form-control-wrap your-name"><input type="text" name="your-name" value="" class="wpcf7-text wpcf7-validates-as-required" size="40" /></span> </p>
<p>Your Email (required)<br />
    <span class="wpcf7-form-control-wrap your-email"><input type="text" name="your-email" value="" class="wpcf7-text wpcf7-validates-as-email wpcf7-validates-as-required" size="40" /></span> </p>
<p>Subject<br />
    <span class="wpcf7-form-control-wrap your-subject"><input type="text" name="your-subject" value="" class="wpcf7-text" size="40" /></span> </p>

<p>Your Message<br />
    <span class="wpcf7-form-control-wrap your-message"><textarea name="your-message" cols="40" rows="10"></textarea></span> </p>
<p><input type="submit" value="Send" class="wpcf7-submit" /><img class="ajax-loader" style="visibility: hidden;" alt="Sending ..." src="http://localhost/wordpress/wp-content/plugins/contact-form-7/images/ajax-loader.gif" /></p>
<div class="wpcf7-response-output wpcf7-display-none"></div></form></div>





    <p></p>

Related posts

Leave a Reply

1 comment

  1. The very first line of that css should be

    .wpcf7-form input, .wpcf7-form textarea {
    

    Your code was treating it as if the form had the id wpcf7-form when that’s actually the class. Also, change the hash to a period for the other style declaration.