Is there a way to assign custom css to a specific form without having to add the code to the entire site?
I don’t like the large margin and field sizes that are created by default but other content managers on our site do. I’d like to create a high-density form that has much tighter margins, smaller form fields, and much less white space, but I don’t want my custom changes applied to any other forms and I don’t want to add custom CSS to the entire Theme or WordPress site. How can I limit my changes to only my single form?
I’ve got the Code Chest plugin installed but I’m having difficulty reducing the horizontal and vertical whitespace, without absolute positioning each field, which I really don’t want to do. Are there any pre-existing classes that can be modified to reduce the sizes, spacing, margins, padding, gaps, etc. in relative ways? The default layout of all the fields is so big it feels like a third grader designed it.
How did you add the form to your website? Did you use Gutenberg, Elementor, Divi, or another page builder? If so, you can add a row or container and then create a multi-column layout such as 1/4 | 2/4 | 1/4. Place the form in the middle column so that it doesn’t take up the entire width of the page. You can even choose a narrower column to reduce the form’s width without manually using custom CSS.
If you still prefer to use custom CSS, please share your website URL so I can take a closer look and suggest custom CSS to reduce the field widths. Thank you.
