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.

Address fields right edge are being cut off

Gravity Support Forums » Plugin Support » Gravity Forms

  1. jeffhiggins
    Member

    I'm having an issue with the "address" form field's right side edge being cut off. This seems to happen no matter how big the page is.

    Example: http://jeffhiggins.ca/procare/contact/

    I've tried messing with the padding settings in my CSS but to no avail. Any ideas? Thanks!

    Posted 12 years ago on Wednesday April 18, 2012 | Permalink

  2. Rob Harrell
    Member

    Try dropping this into your theme's CSS:

    [css]
.gform_wrapper .ginput_complex .ginput_full input {
width: 92% !important;
}
.gform_wrapper .ginput_complex .ginput_right input, .gform_wrapper .ginput_complex .ginput_right select, .gform_wrapper .field_name_first input, .gform_wrapper .ginput_complex .ginput_left input {
width: 84% !important;
}
    Copy

    Also, I deactivated/removed the min-width/max-width on this selector as well:

    [css]
input[type="text"], input[type="password"], input[type="email"], textarea, select {
border: 1px solid #CCC;
padding: 0px 0px;
outline: none;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
font: 13px "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
color: #777;
margin: 0;
min-width: 190px;
max-width: 100%;
display: block;
margin-bottom: 0px;
background: white;
}
    Copy
    Posted 12 years ago on Wednesday April 18, 2012 | Permalink

  3. jeffhiggins
    Member

    Thanks for the super-fast reply Rob. I tried dropping your code snippet and change in, but it didn't seem to work. Then I I tried commenting out the entire "form" section in my CSS (which I'm not a big fan of anyway), and left your new code snippet, and it did work. But then my form fields became comically large. I've left it with my form CSS commented out, but can you tell me how to make the fields appear smaller?

    Thanks again!

    Posted 12 years ago on Wednesday April 18, 2012 | Permalink

  4. Rob Harrell
    Member

    No problem, this padding here in your stylesheet is causing the comically large inputs (LOL - like the descriptor on that one):

    [css]
input {
padding: 10px !important;
font-size: 11px !important;
}
    Copy
    Posted 12 years ago on Wednesday April 18, 2012 | Permalink

  5. jeffhiggins
    Member

    ;) Thanks Rob. I tried dropping that into the CSS but the fields are still super big. Any ideas? Sorry to be a pain.

    Posted 12 years ago on Wednesday April 18, 2012 | Permalink

  6. Rob Harrell
    Member

    No that exists already in your stylesheet. The 10px padding is the cause. That's not a fix. I was just pointing it out.

    If you want to keep that you'll need to target GF's inputs to override it, for example:

    [css]
body .gform_wrapper .gform_body .gform_fields .gfield input[type=text],
body .gform_wrapper .gform_body .gform_fields .gfield input[type=email],
body .gform_wrapper .gform_body .gform_fields .gfield input[type=tel],
body .gform_wrapper .gform_body .gform_fields .gfield input[type=url],
body .gform_wrapper .gform_body .gform_fields .gfield input[type=number],
body .gform_wrapper .gform_body .gform_fields .gfield input[type=password],
body .gform_wrapper .gform_body .gform_fields .gfield select {
	padding:5px 0;
}
    Copy

    You can then change the padding to how you see fit.

    Posted 12 years ago on Wednesday April 18, 2012 | Permalink

  7. jeffhiggins
    Member

    Whoops, sorry! Got it working. I tried the override code first, but that didn't seem to work. I eventually tracked down the input padding code (this theme has like 10 different spaghetti CSS files) and was able to get the fields down to a sensible size.

    Thanks a ton Rob! Gravity Forms is worth every penny.

    Posted 12 years ago on Wednesday April 18, 2012 | Permalink

  8. Rob Harrell
    Member

    Right on man, glad to help out!

    Posted 12 years ago on Wednesday April 18, 2012 | Permalink

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