What is JotForm?
JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.

At JotForm, we want to make sure that you’re getting the online form builder help that you need. Our friendly customer support team is available 24/7.

We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.


  • Profile Image

    Time Field with Time Range option enabled looks odd on mobile

    Asked by Talmor on June 12, 2017 at 06:55 AM
    Sorry

    this is the form

    maybe the problem is with CSS 
    you can see it with your mobile device the see the problem

     

    https://form.jotform.me/62865269843470

  • Profile Image
    JotForm Support

    Answered by Jim_R on June 12, 2017 at 07:22 AM

    Just to confirm, is this the problem on mobile?

    Where the UNTIL text causes the 2nd range's Hour field to display lower?

    If that's the case, try injecting these CSS Codes to move the Until text in between the Time Range:

    .form-sub-label-container:nth-child(3) {

        min-width: 100%;

        margin-top: 12px;

    }

    This would make the Time Field with Time Range to look like the regular Time Field on both desktop and mobile.

    Complete guide: How-to-Inject-Custom-CSS-Codes 

    Result:

    If that's not the issue, I'm afraid you'd have to be a bit clearer on what field needs to be checked and fixed. So far, here's how I see your form:

    1. You have 3 Time Fields.

    2. The 1st and 2nd fields I guess are supposedly Time In and Time Out.

    3. The 3rd one has the Time Range option turned on and this is the one that looks odd on mobile.

    4. I'm also seeing a Text Field that has Total Hours: in it but doesn't show any Form Fields.

    Related guide: Pass-an-Input-Field-to-a-Text-HTML-Field 

    Are you planning to show the difference of the 1st and 2nd Time Fields there OR are you hoping to show the Time Range there? Screenshots are also welcome and you may post them on your thread (not on your email).

    Related guide: How-to-Post-Screenshots-to-Our-Support-Forum 

    Just get back to us with a bit more info and a clearer description of what you're trying to do so we can better assist you.