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 do I remove additional white space above and below form (squarespace iFrame)

    Asked by Chris on November 17, 2014 at 07:52 PM

    Hi Everyone,

     

    I have additional white space above my form, and a lot of additional white space below. How can I remove this?

     

    Thanks!

    Chris

    Page URL:
    http://www.artcrate.co/artist-submission

    and squarespace thanks
  • Profile Image

    Answered by DarkFx on November 17, 2014 at 09:49 PM

    Hi,

    Please copy this CSS to your style or to your Form Styles to eliminate the height of the iFrame and the margin of the top of your form.

     

    #collection-5467bf2ae4b0f227748029e2 #JotFormIFrame {margin: -30px 0 0 0; height:600px !important;}

     

    Thanks.

  • Profile Image
    JotForm Support

    Answered by ashwin_d on November 17, 2014 at 10:07 PM

    Hello Chris,

    Please use the following iframe embed code of your JotForm and see if that solves your problem:

    <iframe id="JotFormIFrame" allowtransparency="true" src="//form.jotform.us/form/43181719743156" frameborder="0" style="width:100%; height:650px !important; max-height:650px !important;border:none;" scrolling="yes"></iframe>

    I have set the max height of the iFrame and that should solve your problem.

    Do get back to us if the issue persists.

    Thank you!

  • Profile Image

    Answered by art_crate on November 18, 2014 at 03:08 AM

    @DarkFx - I could not get your CSS to work.

     

    @Ashwin_d Your code removed all of the white space from below the form, however is there anyway to remove the remaining white space above the form. In the attached screenshot, you can see all of the white space above the form in the squarespace code block.

    http://www.artcrate.co/artist-submission-1

    Thanks!

  • Profile Image

    Answered by DarkFx on November 18, 2014 at 03:31 AM

    Hi,

    Please try this to eliminate the white space on the top of your form.

    Find this CSS to your Form Styles.

    Solution 1.

    @media screen and (min-width: 1024px) {
    /* line 334, http://www.jotform.com/themes/css/style.less */
    .jotform-form {
    padding: 90px 0;
    }

    And replace with this new one.

    @media screen and (min-width: 1024px) {
    /* line 334, http://www.jotform.com/themes/css/style.less */
    .jotform-form {
    padding: 0px 0;
    }

    Solution 2.

    Or copy this CSS to the bottom of your Form Styles CSS.

    .jotform-form {
    padding: 0px 0 !important;
    }

     

    To find the Form Styles follow this guide. How to Inject Custom CSS Codes

     

    Demo: http://form.jotform.me/form/43211994191455

     

    Thanks.

  • Profile Image
    JotForm Support

    Answered by ashwin_d on November 18, 2014 at 04:48 AM

    Hello Chris,

    Please inject the following custom css code in your form which should remove the white space above the form:

    .form-all {

    margin-top: -82px !important;

    }

    The following guide should help you inject custom css code in your form:  http://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes 

    Hope this helps.

    Do get back to us if you have any questions.

    Thank you!

  • Profile Image

    Answered by art_crate on November 18, 2014 at 04:13 PM

    Thanks Guys!

     

    @ashwin_d This worked!

     

    .form-all {

    margin-top: -82px !important;

    }

     

    @DarkFx - that worked inside of the JotForm previewer, however it did not move it inside of the SquareSpace block.

     

    Much appreciated!

  • Profile Image
    JotForm Support

    Answered by Kiran on November 18, 2014 at 05:22 PM

    Glad to see that the issue is resolved for you. It's our pleasure to assist you.

    Please do not hesitate to get in touch with us if you have any questions. We will be happy to help.

    Thank you for using JotForm.