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 can I embed a form without this extra space at the bottom?

    Asked by Oli Bell on April 23, 2015 at 09:33 AM

    Hello.

    I have this form in an iFrame: http://www.landandwave.co.uk/group_deposit_payment.html

    That has a lot of extra space at the bottom I don't want. Is there a way to remove this?

    The form has expandable areas which may be interfering with the height?

    The form is in an AP Div within Dreamweaver.

     

    I also want the form to auto-update when changed in Jotform. Is this achievable? 

    Thank you.

     

    Page URL:
    http://www.landandwave.co.uk/group_deposit_payment.html

    Screenshot
    extra space embed a form Without JotForm height www bottom
  • Profile Image

    Answered by Syed on April 23, 2015 at 10:39 AM

    Hi there;

         Please try to inject the following CSS Code Block to decrease the height of iFrame, read our guide here on How to Inject Custom CSS Codes.

    #JotFormIFrame {height: 1820px !important; }

    Do let us know if you need further assistance on this, we would be happy to assist you in any way.

     

    Thankyou,

  • Profile Image

    Answered by OliBell on April 23, 2015 at 11:09 AM

    Hi - Thanks for your speedy answer.

     

    I have added the custom CSS:

    But the form: http://www.landandwave.co.uk/group_deposit_payment.html still has the extra height at the bottom?

    Here is the iFrame code (from Embed):

    It does show height of 3308px. But this code is generated within Jotform.

    Can you help?

    Kind regards

    Oli

     

     

  • Profile Image
    JotForm Support

    Answered by Mike_G on April 23, 2015 at 12:11 PM

    Hi, Oli Bell,

    What Syed have explained above is correct because that would make the height of the form fit to its content. You are actually on the right track, however, you also need to change the height of the form when you embed it using <iframe>.

    To remove that blank space below your form, here's what you need to do.

    After you embed your form using <iframe>

    You need to update the height of your <iframe> that makes that empty space below your form.

    On the image above, you will see that I have changed the height of the style attribute of the <iframe> to "1700px" from 3200px which was originally set when you embedded your <iframe>.

    You may try to do this, and if this doesn't help you still, kindly let us know. 

    We will wait for your kind response and we will be glad to help you.

     

    Thank you for using JotForm.

     

    Kind regards,

     

    Mike_G

  • Profile Image

    Answered by OliBell on April 23, 2015 at 12:43 PM

    Hello Mike.

     

    Thank you for your reply and YES! copying just the top section and manually changing the height in Dreamweaver has worked.

     

    Thank you very much for your help - excellent customer service.

    Oli

  • Profile Image
    JotForm Support

    Answered by Mike_G on April 23, 2015 at 01:02 PM

    You're welcome, Oli!

    I'm glad to know that you were able to finally remove that blank space on your form. 

    Should you be needing any help in the future, please feel free to ask us anytime.

    Thank you for using JotForm.

     

    Cheers!