Support » Plugins and Hacks » Contact Form 7 » [Resolved] Button Styling Advice

[Resolved] Button Styling Advice

  • Hi I am trying to style the buttons in contact form 7.
    I have followed the advice in this section but can’t quite get it right.
    Is there any new advice on this following the recent updates to the plugin?
    So far I have tried adding .submit-button{….} to my theme’s CSS script and referencing this from the plugin using
    <p align=”left” style=”padding-left:200px”><input class=”submit-button” type=”submit” value=”Send Message” /></p>
    this does not seem to change the button at all for some reason.
    I’ve tried referencing the style of a button elsewhere on the site, which does produce the desired style but the button is then ineffective.
    There must be a missing link here.. do I need to reference something in one of the plugin’s php scripts or is there anything obvious I’m overlooking?
    Thanks for any advice offered! 🙂


Viewing 4 replies - 1 through 4 (of 4 total)
  • In fact the send button is not working on either approach.

    This is the page in question:

    I have tried both of these approaches within the contact form editor:

    <p>[submit class:submit_button “Send Message”]</p>
    <p><input class=”submit_button” type=”submit” value=”Send Message” /></p>

    I have also tried adding to my theme css AND/OR the plugin css as follows:

    .submit_button{ padding:8px 10px 8px 10px; border-radius:5px; background-color:#000000; float:left; font-family:Verdana, Arial, Helvetica, sans-serif; color:#fff; border:none; cursor:pointer;}
    .submit_button:hover{font-family:Verdana, Arial, Helvetica, sans-serif; color:#FF9900;}

    Please help: I need to get the form to work and the styling to take effect

    So now I have the buttons styled using existing css code.
    I have also overhauled my email SMTP settings to get the forms to work!

    The last problem I have is that the message gets sent, but the forms don’t change, so there is no way for the sender to know it has been sent…

    Anyone else had this problem or know how to fix it?


    Okay finally it works – there was an issue caused by my performance/caching plugin which was preventing the correct functioning.

    After a tough journey getting to the end result, I’m pleased to say it works great and looks fantastic..! 🙂

    Resolved! 🙂

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘[Resolved] Button Styling Advice’ is closed to new replies.
Skip to toolbar