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.

Time field not displaying in firefox correctly

  1. magoo
    Member

    Hello,

    I just bought Gravity Forms and the time field is not displaying correctly in firefox. It works in explorer and chrome. Will you please help me?

    http://img825.imageshack.us/img825/8133/formm.jpg

    Thank you,
    Magoo

    Posted 11 years ago on Friday April 26, 2013 | Permalink
  2. Richard Vav
    Administrator

    Can you post a link to a page containing the form in question

    Regards,
    Richard
    --
    Just another member of the community helping out where I can

    Posted 11 years ago on Friday April 26, 2013 | Permalink
  3. magoo
    Member

    Hi Richard,

    It's a clients site, so I can't post a link. But it works fine in chrome and explorer.

    Thanks,
    Chris

    Posted 11 years ago on Friday April 26, 2013 | Permalink
  4. Richard Vav
    Administrator

    Hi Chris,

    Without seeing the form and examining how the CSS rules from your theme, gravity forms, and the browser are interacting and being applied to the elements that form the time field it is difficult to suggest a solution.

    Usually when the colon drops down below the time field it is because a rule in the theme is setting the inputs to display:block which can be counteracted by adding this

    .gform_wrapper .gfield_time_hour input, .gform_wrapper .gfield_time_minute input {
        display: inline !important;
    }

    But that's not the only cause, some themes add a large amount of padding to inputs which make the inputs larger and since the container has a width set then at some point you are going to run out of room and so the colon will drop out of the way. One way of getting round this is to reduce the padding or you can increase the width so here's how to target the hour and minute inputs and containers.

    .gform_wrapper .gfield_time_hour input, .gform_wrapper .gfield_time_minute input {
          width: 50px !important;
    }
    .gform_wrapper .gfield_time_hour, .gform_wrapper .gfield_time_minute {
         width: 100px !important;
    }

    Unfortunately you are just going to have to experiment a little

    Regards,
    Richard

    Posted 11 years ago on Saturday April 27, 2013 | Permalink
  5. magoo
    Member

    Hi Richard,

    Thank you for your help. Where do I place that?

    Thanks,
    Chris

    Posted 11 years ago on Saturday April 27, 2013 | Permalink
  6. Richard Vav
    Administrator

    Chris,

    It depends on the theme, generally it goes in the style.css file but some themes also have a custom.css which doesn't get replaced during updates, either way it wants placing towards the bottom of the file.

    Regards,
    Richard

    Posted 11 years ago on Saturday April 27, 2013 | Permalink
  7. magoo
    Member

    Hi Richard,

    The second one was the charm. Thank you for all your help. Even on a Saturday!

    Kind regards,
    Chris

    Posted 11 years ago on Saturday April 27, 2013 | Permalink
  8. Richard Vav
    Administrator

    You're welcome

    Posted 11 years ago on Sunday April 28, 2013 | Permalink