[Resuelto] Change submit color button

[Autor]

Mensajes

[michaelO-8]

I am trying to: change the submit color button. In the CSS portion of the form, I have tried several things:

1)
.wpt-form-submit form-submit submit submit{
background-color: blue;}

2) #cred_form_3110_1-submit-1-1518469253{
background-color: blue;}

3) adding !important

I am not sure if my theme is overriding the CSS or if I am not targeting the submit button properly

Link to a page where the issue can be seen: enlace oculto
(you must log in to see this form I can provide credentials if needed)

I expected to see: a blue button

Instead, I got: a grey button

[Christian Cox]

I'll be glad to take a look. Please provide login credentials in the private reply fields here.

[Christian Cox]

I'm currently unable to see the form on this page. Are you making modifications now? Please let me know when you would like to continue.

[michaelO-8]

Yes, sorry, I did not realize you could not view it if I was making modifications. Please go ahead.

[Christian Cox]

I updated the CSS in your CRED form's CSS panel:

input[type="submit"] {
  background-color: blue !important;}

Seems to be working now, please check it out.

[michaelO-8]

Thanks, it works!

I checked the rest of the site and the other submit buttons unrelated to Toolset do not seem to be affected (which is good).

It is possible for the CSS provided to affect other buttons (in theory, any other non toolset, <type= submit> buttons could be affected right?) ? If so, is there a way to give Toolset submit buttons a unique class or id that would make sure that they are only affected when I want them to be?

[michaelO-8]

Sorry, did not realize marking this as resolved would prevent you from replying. Will reopen so that I can see your reply.

[Christian Cox]

In order to affect all the submit buttons in CRED forms, you would have to do a couple of things.
1. All CRED forms have the CSS class "cred-form", so you could use that in your style selector:

.cred-form input[type="submit"] {
  background-color: blue !important;
}

2. Move this CSS out of the CRED form CSS panel and into a location that is globally accessible. The CRED form's CSS panel only applies to one particular CRED Form. You could add this code to a stylesheet in your child theme instead, or in the Theme Customizer's Additional CSS panel. I see you also have a Simple Custom CSS plugin active - I'm not familiar with that plugin but you may be able to add this CSS there.

I recommend checking out these links for more information about CSS syntax, selectors, and specificity:
enlace oculto
enlace oculto

[michaelO-8]

Thanks!