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.

CSS formating on text field vs drop box

  1. More of a CSS question than a Gravity Forms question, but I am making some complicated forms with questions floating left and right.

    When I do this, it becomes very obvious that the drop down fields are taller than the regular text fields - you can see it in the Advanced Fields > Address too.

    It doesn't look like gravity forms uses the old-fashioned html 'Select' field, and I have been unable to track down this height setting to add to my custom.css file... any help would be apreciated.

    Posted 12 years ago on Monday September 26, 2011 | Permalink
  2. Gravity Forms by default uses a standard Select field.

    The only time this isn't the case is in the new Gravity Forms v1.6 test release which has an additional option on the Drop Down field to "Enable enhanced user interface" in which case it implements a fancy jQuery based on drop down.

    If you AREN'T using that enhanced option and the field looks different then it's probably due to styles being applied by your theme. If this is the case then you may need to add CSS to your themes stylesheet to override and apply the styles you want.

    There is an area in the documentation that explains how to properly target and style form elements. You can find it here:

    http://www.gravityhelp.com/documentation/page/CSS_Targeting_Samples

    Posted 12 years ago on Monday September 26, 2011 | Permalink
  3. Perfect, I found where else ware in the CSS the text fields had been shrunk down to 1px padding top and bottom. Looks like the Text and TextArea fields were correctly inheriting the style but it was skipping over the select box.

    The link you put up gave me the correct style to enter an override in the custom.css

    body .gform_wrapper .gform_body .gform_fields .gfield select {background: #efe; border: 1px solid #888; padding-top: 1px; padding-bottom: 1px;}

    Posted 12 years ago on Tuesday September 27, 2011 | Permalink

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