color of Send button

8 posts from 3 voices

• Started 11 months ago by c_srishti
• Latest reply from Ismael
• This topic is closed
• This topic is resolved

Tags:

• button color

1. 

   c_srishti
   Member

   Hi,
   http://www.surftherapyyoga.biz/contact-us
   How can I change the color of the send button and the hover of it?
   Thanks
   sRishti

   Posted 11 months ago #
2. 

   Mya
   

   Hi sRishti,

   Add this to your custom.css or Quick CSS.

   #commentform #submit {
       background-color: #DCEDFD;
       background-position: center top;
       background-repeat: repeat-x;
       border-color: #DCEDFD;
       color: #FFFFFF;
   }
   
   #commentform #submit:hover {
       background-color: #FEFFFF;
       border-color: #FEFFFF;
       color: #FFFFFF;
   }

   The first snippet is for the normal state. The second snippet for the hover. These are the current values being used so you'll want to change them as you see fit.

   Regards,
   Mya

   Posted 11 months ago #
3. 

   c_srishti
   Member

   Thanks Mya,
   Surprisingly it didn't work!!!

   I put this in the Custom.css

   /*Comment Form*/
   #commentform #submit {
   background-color: #60a9a5;
   background-position: center top;
   background-repeat: repeat-x;
   border-color: #60a9a5;
   color: #FFFFFF;
   }

   #commentform #submit:hover {
   background-color: #DCEDFD;
   border-color: #DCEDFD;
   color: #60a9a5;
   }

   Any idea?
   Srishti

   Posted 11 months ago #
4. 

   Mya
   

   Hi,

   Try adding !important out to the side of each value like this:

   /*Comment Form*/
   #commentform #submit {
   background-color: #60a9a5 !important;
   border-color: #60a9a5 !important;
   color: #FFFFFF !important;
   }
   
   #commentform #submit:hover {
   background-color: #DCEDFD !important;
   border-color: #DCEDFD !important;
   color: #60a9a5 !important;
   }

   Regards,
   Mya

   Posted 11 months ago #
5. 

   c_srishti
   Member

   Thank sMya,
   It still is not doing it!!! :(
   Am I doing something wrong?
   Please help!
   Srishti

   Posted 11 months ago #
6. 

   Ismael
   Moderator

   Hello,

   Try to replace it with this

   .ajax_form input.button {
   background-color: #60a9a5;
   background-position: center top;
   background-repeat: repeat-x;
   border-color: #60a9a5;
   color: #FFFFFF;
   }
   
   .ajax_form input.button:hover {
   background-color: #DCEDFD;
   border-color: #DCEDFD;
   color: #60a9a5;
   }

   Don't forget to save and remove cache. :)

   Regards,
   Ismael

   Posted 11 months ago #
7. 

   c_srishti
   Member

   Looks good
   Thanks!

   Posted 11 months ago #
8. 

   Ismael
   Moderator

   Hi c_srishti,

   Glad that we could help you. :)

   Cheers,
   Ismael

   Posted 11 months ago #

RSS feed for this topic

Topic Closed

This topic has been closed to new replies.