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

    How to make my form mobile (phone) friendly?

    Asked by chemoreno on November 19, 2016 at 10:14 AM

    I've created a form and used a widget so it can be used over the phone, but the users are having a hard time using it. The Date/Time won't fit and it's causing error as soon as you enter the Date because the Time is then cut off.

    Please help.

    Screenshot
    Mobile Make how Friendly
  • Profile Image
    JotForm Support

    Answered by Jan on November 19, 2016 at 05:39 PM

    I can see that you already inserted the Mobile Responsive widget in your form. Please try enabling the "Make this form Responsive" option in the Form Designer as well.

    Please insert the custom CSS code below in order for the Date Time field to be responsive:

    @media only screen and (max-width: 40em) {

    #label_10 {
    width : 100% !important;
    }

    div#cid_10 {
    display : block;
    }

    #label_21 {
    width : 100% !important;
    }

    #cid_21 {
    display : block !important;
    }

    span.allowTime-container {
    display : block !important;
    }

    }

    Here's a guide on How-to-Inject-Custom-CSS-Codes. Here's the result: 

    Hope that helps. Thank you.

  • Profile Image

    Answered by chemoreno on November 19, 2016 at 11:44 PM
    Hi,
    Yes, it did helped!
    The Dispatch Notification Form just worked beautifully after changes were made.
    Although I struggled a little bit with one of the forms (AMG IC Run Sheet) when I modified the form and added the CSS code, because I had to adjust the width; or maybe I was just doing something wrong. But it appears to be working now as I intended. Can you check on this one for me please? If there's anything that I missed?
    Thanks again..
     -Cherryl
    ...
  • Profile Image
    JotForm Support

    Answered by ashwin_d on November 20, 2016 at 04:54 AM

    Hello Cherryl,

    I did check your form "IC Run Sheet" and it does seems to display correctly in mobile device. I would suggest you to please move your question "Type of Vehicle Use" to a new line and that should give you enough width space to display the date/time filed correctly. Please check the screenshot below:

     

    Thank you!