Title: CSS Submit button
Last modified: August 30, 2016

---

# CSS Submit button

 *  Resolved [Nolve](https://wordpress.org/support/users/nolve/)
 * (@nolve)
 * [10 years, 5 months ago](https://wordpress.org/support/topic/css-submit-button-1/)
 * Hi there,
 * I wanted my submit button to have another color than blue, so I did some research
   on CSS and how to use it for CF7.
 * So, I added a CSS class in the form:
    <p class=”contactFormSendButton”>[submit“
   Send”]</p>
 * And on the page where the form is placed, I added the following CSS:
    .contactFormSendButton
   input{ width: 150px; height: 50px; background-color: #cc652a; font-size: 15px;
   color: #fff; }
 * .contactFormSendButton input:hover[type=”submit”] {
    background:#4f2a0f; cursor:
   pointer; color:#fff; }
 * But still I’m still seeing a blue color, and I have no clue where it’s coming
   from or how to get rid of it… Please see here: [http://www.easysoftwaredeployment.nl/trynow/](http://www.easysoftwaredeployment.nl/trynow/)
 * If you could give me some advise on how to get rid of the blue, I’d be very happy!
   🙂
 * Thanks in advance!
 * [https://wordpress.org/plugins/contact-form-7/](https://wordpress.org/plugins/contact-form-7/)

Viewing 2 replies - 1 through 2 (of 2 total)

 *  [davmerit](https://wordpress.org/support/users/davmerit/)
 * (@davmerit)
 * [10 years, 5 months ago](https://wordpress.org/support/topic/css-submit-button-1/#post-6768213)
 * The actual look of CF7 forms on your website will depend largely on the current
   WordPress theme used and the CSS styling that theme applies to standard HTML 
   form elements. To change the style of your CF7 forms you would need to edit the
   CSS style sheets used by your WordPress theme.
 * You may start with something like ths
 *     ```
       .wpcf7-form .wpcf7-submit{
            background:#4f2a0f;
           cursor:pointer;
           color:#fff;
       }
       ```
   
 * See [Styling Contact Form 7 Forms](http://kb.cf7skins.com/styling-contact-form-7-forms/)
   for a general explanation of styling CF7 forms using CSS.
    ​
 *  Thread Starter [Nolve](https://wordpress.org/support/users/nolve/)
 * (@nolve)
 * [10 years, 5 months ago](https://wordpress.org/support/topic/css-submit-button-1/#post-6768287)
 * Ah yes, I finally found the other CSS from the theme that was interfering with
   the custom CSS for CF7. Thx! 🙂

Viewing 2 replies - 1 through 2 (of 2 total)

The topic ‘CSS Submit button’ is closed to new replies.

 * ![](https://ps.w.org/contact-form-7/assets/icon.svg?rev=2339255)
 * [Contact Form 7](https://wordpress.org/plugins/contact-form-7/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/contact-form-7/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/contact-form-7/)
 * [Active Topics](https://wordpress.org/support/plugin/contact-form-7/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/contact-form-7/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/contact-form-7/reviews/)

 * 2 replies
 * 2 participants
 * Last reply from: [Nolve](https://wordpress.org/support/users/nolve/)
 * Last activity: [10 years, 5 months ago](https://wordpress.org/support/topic/css-submit-button-1/#post-6768287)
 * Status: resolved