creating space between fields « Gravity Support Forums

Gravity Support Forums » Plugin Support » Gravity Forms

servent1
Member

I want to change the default form look to this
http://leaseoptiondango.com/tmp/gravity-form-inspect.png
with the lighter font and more space between fields just
like in the image.
Since I don't know much about CSS but was playing
with the Inspect element in Chrome and tweeked
a few numbers to get it to look the way I wanted.

Now for the change to be permanent I have
to change the forms.css file line 268 just as
I have it, but I notice at the top of the file this:

NOTE: DO NOT EDIT THIS FILE! MAKE ANY MODIFICATIONS IN YOUR
THEME STYLESHEET. THIS FILE IS REPLACED DURING AUTO-UPDATES
AND ANY CHANGES MADE HERE WILL BE OVERWRITTEN.

If you need to make extensive customizations,
copy the contents of this file to your theme
style sheet for editing. Then, go to the form
settings page & set the 'output CSS' option
to no.
Could you elaborate on the last paragraph above?
Do I copy the whole forms.css and append it
to style.css? Perhaps I'm over my head in
playing with the code?

Posted 12 years ago on Thursday August 30, 2012 | Permalink
Rob Harrell
Member

No, you don't have to copy all of the forms.css into your theme. All you need to do is place the CSS you want into your theme's stylesheet. I can help you out here. Do you have a link to your form?

Posted 12 years ago on Thursday August 30, 2012 | Permalink
servent1
Member

Hi Rob,
Will your change modify just that particular GF form or all GF forms? I'd like
to modify just that particular one. Here is my link http://www.leaseoptiondango.com/available-properties/
If you can tell me what you did, I can hopefully learn a thing or two. :)

Tx.

Posted 12 years ago on Thursday August 30, 2012 | Permalink
Rob Harrell
Member
This CSS snippet will only affect the form in question:
```
[css]
#content .page #gform_wrapper_3 ul li {
margin-bottom: 10px;
}
#gform_wrapper_3 .gfield_label {
font-weight: normal;
}
```
Just place it into your theme's stylesheet. Feel free to adjust the px value.
Posted 12 years ago on Thursday August 30, 2012 | Permalink
servent1
Member

Thanks Rob that was easy to do!

Posted 12 years ago on Thursday August 30, 2012 | Permalink
Rob Harrell
Member

RIght on, glad to help!

Posted 12 years ago on Thursday August 30, 2012 | Permalink

This topic has been resolved and has been closed to new replies.