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

    Why is there so much space beneath my published form on my wix site.

    Asked by guardarena on November 04, 2016 at 10:21 AM

    I have two published jotforms on my wix website.

    FORM 1: http://www.guardarena.com/securityguardregistration (This is the problematic one)

    FORM 2: http://www.guardarena.com/createaccount (This one works fine)

    Both forms display great on desktop.

    Form 1 has the following issue:

    When the url that contains form #1 is accessed via any mobile browser, there appears to be a significant amount of space in between the "SUBMIT" button and the end of the page. I have already triple-checked the distance, and made sure the footer is aligned the same as the other form (Form 2)

    Attached is a screenshot that displays how much space there is on FORM 1 VS. FORM 2.

     

    Please look into this error, and let me know, thanks!

    Page URL:
    http://www.guardarena.com/securityguardregistration

    site form on published form Published
  • Profile Image
    JotForm Support

    Answered by Kevin_G on November 04, 2016 at 01:03 PM

    I have checked your form and I can see a difference on the space between the form and the footer you're mentioning, but as per checking the form in a mobile device emulator I can see the JotForm iFrame is displaying properly, but the Jotform iframe seems to be embedded into another iFrame which currently has more height and this is why the space is showing when viewing the webpage in a mobile device.

    Here's a screenshot about it: 

    JotForm iframe: 

    I can also see there are some elements in your current HTML code with a fixed height value in pixels, the height seems to be more than the needed and this is why you're getting that extra space after the form: 

    I would suggest you to check this on your webpage and find which elements are getting a fixed height when viewed in mobile devices, if these HTML elements are corrected then the space should disappear too. 

    I would also suggest you to try embedding your form using the iFrame code directly on your webpage. 

     

  • Profile Image

    Answered by guardarena on November 04, 2016 at 02:44 PM
    Thanks!
    Is Form #2 embedded using the iframe method?
    Thanks,
    Anthony Walker
    Marketing Director
    Info@GuardArena.com
    www.GuardArena.com
    ...
  • Profile Image
    JotForm Support

    Answered by Jim_R on November 04, 2016 at 07:25 PM

    Hey Anthony, I can confirm that Form #2 found on this page http://www.guardarena.com/createaccount was also embedded using the iFrame method. However, it's also enclosed/housed within another iframe just like Form #1 as described by Kevin.

    Try my colleague's suggestions and let us know how it goes. For your convenience, I've copied an excerpt from his previous reply:

    I would suggest you to check this on your webpage and find which elements are getting a fixed height when viewed in mobile devices, if these HTML elements are corrected then the space should disappear too. 

    I would also suggest you to try embedding your form using the iFrame code directly on your webpage. 

  • Profile Image

    Answered by guardarena on November 04, 2016 at 08:44 PM
    I checked elements and the form still displays with the spacing. What are
    my other options?
    ...
  • Profile Image
    JotForm Support

    Answered by Kevin_G on November 05, 2016 at 12:16 AM

    What I would suggest you is to try injecting this CSS code to your website, since this is something most likely related to your webpage.

    #comp-isthigx5iFrameHolder, #comp-isthigx5{

            height: 2000px;

    }

    #pu49rinlineContent, #pu49rbg, #pu49r, #SITE_PAGES, #PAGES_CONTAINERinlineContent, #PAGES_CONTAINERbg, #PAGES_CONTAINERcenteredContent, #PAGES_CONTAINERscreenWidthBackground, #PAGES_CONTAINER{

        height: 2199px;

    }

    I would suggest you to inject it between the <style> tags in your webpage or using the website builder, in case that you're using one. 

    I would also recommend you to check the responsiveness of your webpage, seems like in this specific webpage it is setting up more height than the needed.

    Also, if possible please try embedding your form using directly the iFrame code to your website, currently you're still embedding your form within another iFrame. 

    Hope this helps.

  • Profile Image

    Answered by guardarena on November 05, 2016 at 12:44 AM
    However, form#2 is displaying properly?
    Thanks,
    Anthony Walker
    Marketing Director
    Info@GuardArena.com
    www.GuardArena.com
    ...
  • Profile Image
    JotForm Support

    Answered by Welvin on November 05, 2016 at 11:06 AM

    Yes, it's displaying correct as far as I could see it. Are you still getting issues with form #2? Let us know.