How to Add Custom CSS to a Form Field

You may need to add custom CSS for a specific form field. Here are some steps that you need to follow.

1. Navigate to weForms > All Forms > Add a new form or Edit an existing form.
2. Add a field to the form (e.g Text field)
3. Click on the edit icon to edit the Text field
4. Under the Advanced Options, there is an input field called CSS Class Name. Provide a class name for this field (e.g my-custom-css).
5. Now, inside your child theme’s style.css file, add your custom CSS for that class selector.

If you are not familiar with a child theme you can check out how WordPress recommends how to set up a child theme. Not putting your CSS in a child theme could lose your changes when updating your WordPress theme.

Example:

[css]

li.my-custom-css .wpuf-fields input#text_655 {
padding: 10px;
width: 50%;
}

[/css]

Watch The Video To View The Entire Process!