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 messed up. Labels and fields displaying wrong.

  1. Hello. The labels and fields are displaying wrong. Can someone be specific with what I can do to correct the CSS if that is the problem.

    Most visible with address fields where city, state, etc… are all out of align.

    Also…The size of the text boxes.

    Is this being affected by my theme css?

    Thanks

    https://www.familycaremedicalalarms.com/quarterly-plan

    Posted 7 years ago on Thursday June 14, 2012 | Permalink
  2. Gravity Forms is setup to inherit styles from your theme if it contains references to form elements. This is actually just due to how CSS works and functions. This screenshot shows you what the issue is in terms of your input's sublabels.

    Try dropping this CSS snippet into your theme's stylesheet:

    [css]
    .gform_wrapper .field_name_first input, .gform_wrapper .ginput_complex .ginput_left input,  .gform_wrapper .field_name_last input, .gform_wrapper .ginput_complex .ginput_right input {
    margin-bottom: 0;
    }
    Posted 7 years ago on Thursday June 14, 2012 | Permalink
  3. That helped. It aligned the address area properly. Thank you.

    I still want to get this form looking much better than it does. The fields and drop downs are skinny and not large like I want, it also seems there is very little styling, very bland look. I'm not sure if this is just GF's default look, or the css of my template.

    A work in progress. Thanks

    Posted 7 years ago on Thursday June 14, 2012 | Permalink
  4. It is, you can add some height to the inputs if you like. It's mainly because of the font-size declaration coming from your theme, again.

    Try dropping this in:

    [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"] {
    height: 25px;
    }
    Posted 7 years ago on Thursday June 14, 2012 | Permalink
  5. Hi don't know why but the for will not display correctly

    if you view here
    http://www.isgquickpay.com/sme-payroll-cash-flow/

    and click the How can we help button at the bottom you can see the issue

    hope you can help

    Posted 7 years ago on Tuesday July 17, 2012 | Permalink
  6. Looks like you need to enqueue the scripts and styles for that form. Take a look here at the bottom of this page:

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

    Posted 7 years ago on Tuesday July 17, 2012 | Permalink