I built a form that, when plugged into my site with no additional CSS, displays in two columns: The left column is the question (which I see via Firebug that class name is "gfield_label") and the right column are the choices.
I am curious how I change the width of the left column, as right now it's very narrow and my questions are very squished together. I have tried editing the forms.css file and making adjustments to the width of gfield_label, but nothing is happening.
Thanks!
*NEVER* edit the plugin files or form.css file because those changes will be overwritten when you install an update to Gravity Forms.
Anytime you want to override Gravity Forms styles and customize a form via CSS you can do so by adding CSS to your themes stylesheet that targets the Gravity Forms CSS classes and ids.
Another good option is to copy the entire contents of the forms.css file and paste it into your themes stylesheet. Then go to the Settings page of Gravity Forms and turn off CSS output. This will then use the styles from your theme stylesheet only and you can then customize the Gravity Forms styles all you want.
You should be able to make adjustments to the gfield_label class using either of the above methods. You just need to make sure you understand what classes and CSS is being called and pay attention to CSS inheritance because something else may be setting the width outside of gfield_label and because of inheritance it is then inheriting that width.
You can find out CSS guide here:
Thanks so much—I actually discovered that the CSS was added to my default stylesheet once I installed GravityForms (I'm using a Woo theme) so I was able to go in and make changes.
Thanks again for the help and for the tip about not editing Gravity Forms' CSS!
