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 Assistance Please

Gravity Support Forums » Plugin Support » Gravity Forms

  1. kstew
    Member

    I have most of the form styled already but I'm now trying to get a few things changed.

    I would like to increase the actual input field size for the name and email fields. I already added some CSS coding to alter .medium/.large, but it only updated one field (phone).

    Also, if possible I wanted to made the text inputted by the user to be larger, in addition to making the field names (i.e., first, last, e-mail, confirm email) larger as well.

    Has anyone done these changes before? Help would be appreciated.

    Posted 11 years ago on Thursday April 4, 2013 | Permalink

  2. kstew
    Member

    Can anyone help please?
    I've tried the different CSS that are shown on the Gravity Forms Design Layout page but still can't make those changes.
    Please point me in the right direction to make these fields larger. Thanks.

    Posted 11 years ago on Friday April 5, 2013 | Permalink

  3. David Peralty

    Can you link to your form please?

    Posted 11 years ago on Friday April 5, 2013 | Permalink

  4. kstew
    Member

    Yes, sorry about that.

    http://medtransportcenter.com/newsite/contact

    Posted 11 years ago on Friday April 5, 2013 | Permalink

  5. Richard Vav
    Administrator

    Unfortunately we can't see your form as your link is displaying a maintenance mode page

    Posted 11 years ago on Saturday April 6, 2013 | Permalink

  6. kstew
    Member

    Could you please look now, I removed the maintenance mode. Thanks.

    Posted 11 years ago on Monday April 8, 2013 | Permalink

  7. Richard Vav
    Administrator

    So to increase the size of the text in the inputs you would add something like this to the bottom of your themes stylesheet, setting the pixel size to whatever to want, increasing the font size will also increase the height of the inputs as well.

    .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] {
    font-size: 20px;
}
    Posted 11 years ago on Tuesday April 9, 2013 | Permalink

  8. Richard Vav
    Administrator

    To increase the size of the sub labels you would use something like this

    .gform_wrapper .ginput_complex label, .gform_wrapper .gfield_time_hour label, .gform_wrapper .gfield_time_minute label, .gform_wrapper .gfield_date_month label, .gform_wrapper .gfield_date_day label, .gform_wrapper .gfield_date_year label, .gform_wrapper .instruction {
    font-size: 20px;
}
    Posted 11 years ago on Tuesday April 9, 2013 | Permalink

  9. kstew
    Member

    Thank you sir. All was fixed except the paragraph text field which still has very small input text.
    I tried using .textarea / .textarea input but it didn't work.

    Posted 11 years ago on Tuesday April 9, 2013 | Permalink

  10. Richard Vav
    Administrator

    Sorry about that, missed one, try adding .gform_wrapper textarea, to the start of that CSS like so

    .gform_wrapper textarea, .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] {
    font-size: 20px;
}
    Posted 11 years ago on Tuesday April 9, 2013 | Permalink

  11. kstew
    Member

    Perfect, thank you very much.

    Posted 11 years ago on Tuesday April 9, 2013 | Permalink

  12. Richard Vav
    Administrator

    You're welcome

    Posted 11 years ago on Tuesday April 9, 2013 | Permalink