Styling issues with form fields and dropdowns

Support
#1

I’m trying to diagnose styling issues with form fields and dropdowns in X. For my contact form, I’m using Ninja Forms and for eCommerce I’m using WooCommerce. As you can see from the screenshots, each solution is pulling in completely different styles. I reached out to Ninja Forms and they said their form solution adopts styles from the theme, and I assume WooCommerce should function in a similar way. I would like all form fields and dropdowns to match what you see on the Ninja Form, since this is much more modern looking.

Can you provide a solution to make all form fields and dropdown match site wide?


#2

Hi @bartenderonduty,

Thank you for writing in, yes most of the plugin adopts the theme styling on their forms, unfortunately WooCommerce is not one of those plugins, it has its own styling.

You can try the CSS code provided here. or formulate your own styling using Custom CSS.

You can find the proper CSS code selector using the Chrome browser Developer Toolbar, and also use it to see the styling of your Ninja Forms.
For the CSS code itself, I suggest that you get started with this tutorial

Cheers!

#3

Thank you!

#4

You’re welcome.

#5

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.