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.

Increase height of form fields

  1. Right now the form fields on my user registration page look like this:
    http://i179.photobucket.com/albums/w309/buddha614/ScreenShot2012-08-28at34913PM.png

    And I would like them to look more like this:
    http://i179.photobucket.com/albums/w309/buddha614/fields1.png

    I would like to increase the height.

    I found some documentation here:
    http://www.gravityhelp.com/frequently-asked-questions/faq-styling-formatting/

    With additional instructions here:
    http://www.gravityhelp.com/documentation/page/CSS_Targeting_Samples

    The instructions are asking me to do this:
    "you would simply view your source, find the form ID and replace the ID in my examples with your own."

    Are there any more detailed instructions than this anywhere? Something that is step by step? Nothing in the two above links makes any sense to me.

    Can I simply do this by adding a css class name in the form editor? And if so what would I add. None of the ready class stuff I found applied to what I am trying to do.

    Thanks for any help.

    Posted 11 years ago on Tuesday August 28, 2012 | Permalink
  2. David Peralty

    If you can link to your form, one of our team could potentially help you write the CSS you'll need to make the change you want.

    Posted 11 years ago on Wednesday August 29, 2012 | Permalink
  3. Thank You! That would be great.

    When you say "link to my form" do you mean that you need a link to the page that is using the form? or something else?

    Here's the page:
    http://templemountaintea.com/new-user-registration/

    Also, can you tell me where I insert the CSS that I want to use?

    Thanks for your help.

    Posted 11 years ago on Wednesday August 29, 2012 | Permalink
  4. Drop this into your theme's stylesheet. Each theme is different, so your theme's documentation might tell you where the ideal place for you to put it would be.

    [css]
    .gform_wrapper input[type="text"], .gform_wrapper input[type="url"], .gform_wrapper input[type="email"], .gform_wrapper input[type="tel"], .gform_wrapper input[type="number"], .gform_wrapper input[type="password"] {
    -webkit-border-radius: 0 !important;
    -moz-border-radius: 0 !important;
    border-radius: 0 !important;
    height: 25px;
    }
    Posted 11 years ago on Wednesday August 29, 2012 | Permalink
  5. Thanks. You guys are amazing. So far I have not been able to make it work but I am not very knowledgeable about these things. I'm sure that after a little investigation I will have some success.

    Thanks again.

    Posted 11 years ago on Wednesday August 29, 2012 | Permalink
  6. OK! I got it to work. I am using Headway and it was as simple as just placing the code you gave me into the live css editor. Thanks again.

    I just got started with Gravity Forms a couple of days ago and have had to ask for the help on the forum a few times already and you guys have been great. I wasn't entirely sure that spending the money on the developers licence was going to be worth it for me, but I has been.

    Thanks again.

    Posted 11 years ago on Wednesday August 29, 2012 | Permalink
  7. Erik, thanks for your kind words and your support as well. We're glad to help out!

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

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