Life is a Mystery

GravityForms CSS Classes

This is a demonstration of the GravityForms CSS classes.

GF CSS Classes

    gf_list_2col, gf_list_3col, gf_list_4col, gf_list_5col ... This turns a multiple choice/checkbox list into an equally-spaced column format. This only applies to multiple choice/checkbox lists and work with any of the form label position settings.
    This turns a multiple choice/checkbox list into an inline horizontal list (not evenly spaced columns). This only applies to multiple choice/checkbox lists and work with any of the form label position settings.
    gf_list_height_25, gf_list_height_50, gf_list_height_75, gf_list_height_100, gf_list_height_125, gf_list_height_150 ... This applies a pixel height value all multiple choice/checkbox items in that list. This can be useful to avoid "hanging floats" caused by list items of unequal height. This only applies to multiple choice/checkbox lists and work with any of the form label position settings.
  • gf_scroll_text

    This converts a section break field into a box with a fixed height that will automatically show a scroll bar if there’s a large amount of text. This is useful if you’re wanting to show large amounts of content to the user, but don’t want to have to link to it or make the form very long to show it (Terms of Service Agreements, etc). This class only works on section breaks and works with any of the form label position settings.

    The text should be placed in the section break description.

    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc et tincidunt nibh. Donec aliquet felis ultricies consectetur feugiat. Aenean ultricies velit ut est facilisis, at sagittis lorem gravida. Ut ex ipsum, tempor sit amet porttitor lacinia, pretium fringilla turpis. Curabitur finibus ipsum vitae lacus tincidunt, non pretium libero tempus. Vivamus sagittis augue sed consectetur lacinia. Mauris sit amet sapien sed quam euismod luctus. Curabitur imperdiet sem a erat faucibus bibendum. Maecenas placerat elit ac felis efficitur, non sagittis diam tincidunt. Vivamus eu condimentum eros, facilisis consectetur arcu. Donec tortor nisl, tempor in placerat vel, posuere at velit.

    Mauris pharetra non diam ut luctus. Nunc nec nisi id urna scelerisque ornare. Maecenas vitae justo quis ante elementum vestibulum vitae ut risus. Maecenas porta scelerisque elit, sed faucibus lectus tincidunt non. Maecenas tincidunt semper metus non venenatis. In hac habitasse platea dictumst. Duis id quam pretium neque elementum aliquet. Praesent dignissim leo ac metus laoreet, sagittis gravida nulla fringilla. Nam porttitor sem eget orci dictum, ac dictum urna commodo.

    Nulla ac velit vulputate, molestie mi eget, bibendum enim. Nulla mattis sapien eu mi pharetra elementum. Vestibulum purus libero, consectetur elementum sodales a, tristique vel nunc. Cras urna ex, egestas ut suscipit in, semper ut purus. Mauris vel justo erat. Phasellus id ante eu quam egestas sodales eu ut est. In ac metus eros. Pellentesque efficitur nec magna at rutrum. Etiam volutpat est non lectus malesuada laoreet. Etiam at tortor libero. Nulla in diam augue.

    Nunc ornare, ipsum vitae ultrices tempor, massa risus ultricies nulla, at tempus urna ipsum et nisi. Praesent erat ex, ullamcorper non congue et, tempor ac purus. Pellentesque ut orci vitae elit vehicula pharetra ut eu lacus. Suspendisse accumsan orci felis, eu ullamcorper lacus feugiat a. Pellentesque ac molestie urna, vel consequat lectus. Etiam non porttitor sem. Fusce ultricies ex in purus posuere sodales.

    Pellentesque a ex est. Integer a rhoncus risus, vitae consequat mi. Suspendisse enim quam, posuere quis fringilla a, ornare euismod risus. Nam nec viverra mauris. Aliquam vel turpis a sem ultrices convallis nec ac leo. Duis nulla lorem, ultrices id metus at, hendrerit ultricies ante. Duis aliquet efficitur orci nec feugiat. Nullam ut leo purus. Fusce vitae magna tincidunt, egestas nisi et, consectetur libero.

  • :
    This hides the am/pm selector in the time field- this only hides the field on the form, not in the form entry table. This works with any of the form label position settings.
  • This hides the characters left counter beneath paragraph text fields when using the maximum characters option. This works with any of the form label position settings.
Eric Celeste / Saint Paul, Minnesota / 651.323.2009 / efc@clst.org