Gravity forms inheriting disfunctional colors

[Torah541]

Hi Awesome support team.

I can’t figure out why gravity form fields have a black background making the webpage look dysfunctional.
Gravity forms says it inhenrits ithe forms appearance from the website settings but I can’t find the setting causing the issue. Please advise!

[tristup]

Hi @Torah541,

Thanks for reaching out.
The style appearing from the stack is selected at the Theme Options. To override the default style for that stack, you need to add the following custom CSS code into the Global CSS.

.gform_wrapper input
{
    background-color: transparent!important;
}

Please remember that the above code will work if copied as it is and doesn’t conflict with any existing style.
Please note that the code provided serves only as a guide to help you get started custom coding on your own if there’s no option offered in our theme or the products we bundle.
We really do not provide support for custom codes which means we can’t fix it in case it conflicts with something on your site nor will we enhance it. Further customization should be directed to a third-party developer or you can avail of One, where we answer the questions beyond normal theme support.

Thanks

[Torah541]

Thank you. That worked Problem, it seems that it made the submit button transparent too.

[prakash_s]

Hello @Torah541,

I would suggest you please update the previous custom CSS code with this code and recheck it again.

.gform_fields.top_label input {
background-color: transparent!important;
}

The purpose of providing custom CSS is to show you how to add CSS code to your site. Writing custom CSS is outside the scope of our theme support. If you need more customization, you need to learn CSS and learn how to use the browser’s element inspector.In case you have no idea about coding you can subscribe to One where customization questions are answered.

Hope it helps.
Thanks

[Torah541]

That didn’t work. The submit button is still transparent. Any ideas?

[ruenel]

Hello @Torah541,

Please remove this custom CSS from the cde above:

.gform_wrapper input
{
    background-color: transparent !important;
}

Thanks.

[Torah541]

didn’t work. submit button still transparent.

[prakash_s]

Hello @Torah541,

I would suggest you please add this custom CSS code to the global CSS.

input#gform_submit_button_1:hover {
    background-color: rgb(113,196,203) !important;
}
input#gform_submit_button_1 {
    background-color: rgb(21,23,74) !important;
} 

The purpose of providing custom CSS is to show you how to add CSS code to your site. Writing custom CSS is outside the scope of our theme support. If you need more customization, you need to learn CSS and learn how to use the browser’s element inspector.In case you have no idea about coding you can subscribe to One where customization questions are answered.

Hope it helps.
Thanks

[Torah541]

I copied in the CSS code to Global CSS and it is still not working why could this be?

[tristup]

Hi @Torah541,

In that case, you need to add the following custom CSS code in place of the previous code given by me.

.gform_wrapper input:not([disabled]):not([type="submit"]) 
{
    background-color: transparent!important;
}

Hope it helps.
Thanks

[Torah541]

grrrrrr… is still not working! please advise!

[prakash_s]

Hello @Torah541,

I checked your given site URL it seems that the submit button background color is working fine on my end. It might be the issue of browser cache I would suggest you please clear your browser cache and then check it again. If it doesn’t work for you, please share your details in a secure note. Please provide the following details

• WordPress Login URL
• Admin-level username and password

You can find the Secure Note button at the bottom of your posts

Thanks

[Torah541]

i just checked from a different device and it seems that I still have same issue.

[prakash_s]

Hello @Torah541,

Thanks for sharing the login details I went ahead and checked your settings it seems that you have not added the closing curly bracket to your custom CSS code just because the CSS was not working.

I went ahead and added the closing curly bracket and added this custom CSS code as well now you need to clear your browser cache and recheck it again.

The purpose of providing custom CSS is to show you how to add CSS code to your site. Writing custom CSS is outside the scope of our theme support. If you need more customization, you need to learn CSS and learn how to use the browser’s element inspector.In case you have no idea about coding you can subscribe to One where customization questions are answered.

Hope it helps.
Thanks

[Torah541]

Thank you
I appreciate all you help.

[tristup]

Hi @Torah541,

Glad that we are able to help you.

Thanks

[Torah541]

I am having a the same issue with the submit button, on a new form on a different page. Why would this occur if the global CSS code is solving the other page’s issue?

[tristup]

Hi @Torah541,

I would suggest you add the same form on a blank page and check if the problem exists or not. If not, then there might be something in the Page CSS of that page that causes the issue.
Please remember that we don’t offer support or investigation on custom coding issues.

Thanks