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 optimize the map size for mobile browsers?

    Asked by binanindita on December 30, 2016 at 05:54 AM

    at the moment the embedded map is wider than safari / iphone

    Page URL:
    https://form.jotform.me/binanindita/ship-to-geotagging-by-sales-team

  • Profile Image
    JotForm Support

    Answered by AIDAN on December 30, 2016 at 06:15 AM

    Hi, thank you for contacting us.

    In order to optimize the map for both desktop and mobile browsers, please inject this custom CSS code:

    #customFieldFrame_3 {

        width: 100% !important;

    }

    I created an animation to guide you through achieving that:

     

     

    For a general tutorial on how to inject custom CSS code into a form, please see https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes

    I also created a corrected form in case you would like to clone ithttps://form.jotform.com/63642284918969

    If you need further assistance please let us know. We will be happy to help. Thank you.

  • Profile Image

    Answered by binanindita on February 09, 2017 at 03:45 AM
    Is it possible that my form is optimized for both mobile browser and
    desktop browser screen width?
    I need this form to work in both browsers, and especially on desktop it
    needs big map
    Thanks in advance, for the help
    ...
  • Profile Image
    JotForm Support

    Answered by Mike_G on February 09, 2017 at 04:02 AM

    Your form should be responsive for both mobile and desktop view.

    Are you having issues with your form's optimization with any of the devices (mobile or desktop)? 

    Can you help us by giving us more information, please?

    Does the workaround using the CSS codes that my colleague, Aidan, have provided did not work or solve your issue?

    We will wait for your response. Thank you.

  • Profile Image

    Answered by binanindita on February 09, 2017 at 07:45 AM
    Yes, the CSS code worked well for mobile browser. The map fills the width
    of mobile browser's screen.
    However, the desktop: the map width is not as wide as the browser screen.
    See below. Can we make this map wider on desktop?
    [image: pasted1]
    ...
  • Profile Image
    JotForm Support

    Answered by Mike_G on February 09, 2017 at 08:10 AM

    After creating a clone version of your form, I found out that you have added the CSS codes my colleague have provided under the CSS tab of the GPS Location Widget.

    I would (also) suggest you inject the CSS codes to your form as instructed in the screenshot/guide that my colleague provided above.

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

    Thank you.