[Plugin: Contact Form 7] CSS Style for just Submit button

  • Resolved databell96

    (@databell96)


    14 years, 1 month ago

    I’m trying to style the submit button on my contact form since it’s taking all the styles from the input fields. Which I don’t want.

    My form is here:

    and I see the class wpcf7-submit buttonSubmit so I tried to use styles like this:

    .wpcf7-submit buttonSubmit { width: 100px }

    or

    .buttonSubmit { width: 100px }

    Neither of which work. So what does?

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

  • edit the Styles.css location in the plugins directory. Think you will have to add a section into it like:
    div.wpcf7-submit
    {
    color: #ff0000;
    background-color: #CC0000
    }

    Thread Starter databell96

    (@databell96)

    I just tried that. Didn’t work at all.

    You know. Looking at it myself….I don’t think it would work either. Its for an input field. It should be:

    input.wpcf7-submit
{
color: #ff0000;
background-color: #CC0000
}

    Sorry. I am not perfect. Just damn close….

    You can create its on CSS class and add the class name to the input field in the form.
    [submit class:submitbutton "Submit & Download Coupon"]
    Then add the styling in your css file.
    .wpcf7 .submitbutton {color:#FFF; background-color:#111;}

    The above would work for native CF7 styles if written like:
    input[type="submit"] .wpcf7-submit.submitbutton {}

    Hope this helps.

    Thread Starter databell96

    (@databell96)

    Just damn close? That’s all you can hope for in this life ??

    Thanks to all.

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘[Plugin: Contact Form 7] CSS Style for just Submit button’ is closed to new replies.