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

    Mobile responsive form, date field and Geocomplete widget

    Asked by EffieMcNair on March 08, 2016 at 10:53 AM

    I'm trying to get my form to be a mobile friendly and followed the instruction in the guide, also tried the Widget but still have a couple of problems. The GeoComplete widget seems to be not responsive, also the date field is too small and I'm not able to fix it.

    Please see screenshot attached.

    and link to my form here:-  https://www.jotform.com//?formID=60521600524846

     

    Thanks

    Effie

    Screenshot
    Mobile mobile responsive JotForm date field www
  • Profile Image
    JotForm Support

    Answered by david on March 08, 2016 at 12:54 PM

    For the date field, add this code to your form:

    http://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes

    @media only screen and (max-width: 480px){
        #day_17, #month_17, #year_17{
            width : 65px !important;
        }
        #cid_17 {
        width : 480px !important;
        }
    }

    The widget is proving to be a bit trickier, I will follow up with that code as soon as I can.

  • Profile Image
    JotForm Support

    Answered by david on March 08, 2016 at 01:04 PM

    For the widget, add this code directly to the widget under its CSS tab:

    @media only screen and (max-width: 480px){
       .geoComplete{
          width : 250px !important;
       }
    }

    Here is the resulting form with both changes made:

    https://form.jotform.com/60674769206969