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.

Help with styling form

Gravity Support Forums » Plugin Support » Gravity Forms

  1. conorpp
    Member

    Howdy,

    I'm trying to style a particular form. I can get it working with CSS output on but my rough effort changes the css for all forms. Here is the CSS I got to work for all forms: http://pastebin.com/c4QasskP - (its not elegant but for general testing/ playing its not really an issue).

    I read that I can style particular form here: http://www.gravityhelp.com/forums/topic/styling-multiple-forms-working-for-some-styles-not-others but I'm having issues getting it to work correctly. Its form id:1 btw.

    Thanks

    Posted 13 years ago on Sunday March 13, 2011 | Permalink

  2. Kevin Flahaut
    Administrator

    You pretty much just have to change the .gform_wrapper class to the #gform_wrapper_1 ID in your css. Using inheritance based on the ID rather than the general class will only apply the changes to that specific form.

    http://pastie.org/1665789

    Here are some CSS targeting guidelines you might find handy. There are samples that apply globally to all forms as well as samples applied to a specific form ID.

    http://www.rocketgenius.com/gravity-forms-css-targeting-specific-elements/

    Posted 13 years ago on Sunday March 13, 2011 | Permalink

  3. conorpp
    Member

    Thanks your solution worked perfectly :)

    I'm also would like to style a GF widget to look the same as the main form created above. I've been trying to get #gform_widget-3 working but so far having no luck.

    Thanks

    Posted 13 years ago on Tuesday March 15, 2011 | Permalink

  4. Kevin Flahaut
    Administrator

    You would target a widget the same way as any other form.. based on the unique wrapper name.. #gform_wrapper_3 (where the 3 is your form ID).

    You could specify the inheritance from the containing sidebar list item as you mentioned (#gform_widget-3), but if you set your rules based on inheritance from the form wrapper div, they will still apply to that form wherever you put it.. sidebar, body content, etc.

    Posted 13 years ago on Tuesday March 15, 2011 | Permalink