PLEASE NOTE: These forums are no longer utilized and are provided as an archive for informational purposes only. All support issues will be handled via email using our support ticket system. For more detailed information on this change, please see this blog post.

Gravity form CSS question

  1. Hi, I am trying to edit the CSS stykes of the Gravity Form in my website,
    http://valleyviewwinery.com/order-test/

    I had been instructed to deactivate and re-upload GF, I've done this. The path seems to be correct.

    I am wanting to remove the little list style circles from the left of each item and I'd also like the "Where would you like the wine sent" to increase the line height. It looks like the form is picking up my general site styles???

    Also the spacing for the address fields is really tight and I'd like to add some space to these fields.

    I did copy and paste the GF form CSS into my Woo Custom style sheet and changed the output CSS setting to no.

    Any help or direction would be appreciated.

    Posted 14 years ago on Saturday August 28, 2010 | Permalink
  2. Okay, still same thing as the other day. The Gravity Forms styles aren't being output. You said you put them in your custom.css file, but it's not outputting them that I can see.

    http://valleyviewwinery.com/wp-content/themes/coffeebreak/custom.css

    Do a search on that page for "gform" and it returns nothing. Are you sure you've added them in the right place? If you're not sure where to put them or are having problems loading stuff from the theme, you'll want to contact the Woo Themes support group for some leadership there.

    Also, FYI, WooThemes has some default Gravity Forms styles added to their themes. You can see that in the styles.css file for the theme.

    http://valleyviewwinery.com/wp-content/themes/coffeebreak/style.css

    /* Gravity forms */
    
    .gfield { margin-bottom: 10px; }
    .gform_wrapper .top_label .gfield_label { display:block;float:left; padding-right:20px; width: 100px; margin: 5px 0px 4px !important; }
    .gform_wrapper input { padding: 7px 3px !important; }
    .gform_wrapper .top_label input.large, .gform_wrapper .top_label select.large, .gform_wrapper .top_label textarea.textarea { width: 350px !important; padding: 7px 3px !important; }
    .gform_wrapper .entry img, .gform_wrapper img.thumbnail { padding: 0px !important; border: 0px !important; }
    ul.top_label .clear-multi { clear: none !important; }
    .gform_wrapper .gfield_checkbox, .gform_wrapper .gfield_radio { margin-left: 120px !important; }
    img.ui-datepicker-trigger { border: 0px; padding: 0px; }
    .gform_wrapper .top_label input.large, .gform_wrapper .top_label select.large, .gform_wrapper .top_label textarea.textarea, .gform_wrapper input { background: #FCFCFC; border: 1px solid #E2E2E2; }
    .gform_wrapper input.button { background: #F0F0F0 no-repeat 90% 50%; border: 0px !important ; color: #333; font-size: 12px !important; padding: 4px 25px 4px 25px !important; text-transform: uppercase; margin-right: 20px; }
    .gform_wrapper input.button:hover { background: #DBDBDB; }

    So, the run down, get the Gravity Forms styles loaded properly somewhere and most of the spacing and size issues you're seeing will be taken care of. Then if you're still seeing the bullets from your theme, you can look at the FAQ page for the fix to remove those. It's under the styling section.

    http://www.gravityhelp.com/frequently-asked-questions/

    Lastly, since there are some custom form styles in the style.css file, you may have to remove or modify those as well to get the form set to your liking.

    Posted 14 years ago on Saturday August 28, 2010 | Permalink
  3. Kevin, Thanks again for your support, I do appreciate it. I logged into my sites WP admin and looked at my custom.css page and all the gform styles I had added were there but when I looked at the link you posted above, no gform styles as you pointed out. Then I connected to my site through Dreamweaver, opened the custom css and added the gform code to it directly, uploaded it and it seems to have worked. This scenario is strange, not sure why the custom css was not updating through the admin? At least some progress has been made.
    http://valleyviewwinery.com/order-test/

    Thanks,

    Krista

    Posted 14 years ago on Saturday August 28, 2010 | Permalink
  4. Yep. It looks much better. I'm not sure about the problem with the admin not updating the file. If you continue to have problems with that, you might want to ask the WooThemes team for some help there.

    I'm pleased that I could help. If you need anything else, don't hesitate to ask us.

    Posted 14 years ago on Sunday August 29, 2010 | Permalink