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

    Excess padding / margin in Chrome

    Asked by benzy16 on February 28, 2014 at 04:21 AM

    I've created a form which fits into a box on my new responsive site (still on testing server) but in chrome it has a large space at the bottom of the form and I can't figure it out, my additional css is pretty clean as far as I can see i'm not sure why this happens as it seems to only be on chrome.

     

    .form-line {

    padding-bottom: -1px;

    padding-top: -1px;

    }

     

    .form-all {

    float:left;

    margin-top: 0px;

    padding-top: 0px;

    padding-bottom: 0px;

    margin-bottom: 0px;}

     

    .form-submit-button {

    padding-bottom: 0px;

    margin-bottom: 0px;

    padding-top: 0px;

    margin-top: 0px; }

    Page URL:
    http://theseolab.co.uk/FEedwater/?page_id=3260

    float site form-line all
  • Profile Image
    JotForm Founder

    Answered by aytekin on February 28, 2014 at 10:54 AM

    I see the problem and I opened a ticket about this. 

    For now, if it bothers you a lot you can use the iframe code instead. The height can be modified on the embed code. 

    https://www.jotform.com/help/148-Getting-the-Form-iFrame-Code

  • Profile Image

    Answered by benzy16 on February 28, 2014 at 11:00 AM

    Thank you for getting back so quickly

    I have tried the iframe and unfortunately it appears to be unsuitable for our set up, it show up as an empty box so back to the drawing board!

  • Profile Image

    Answered by EliezerN on February 28, 2014 at 01:35 PM

    @benzy16

    Could you please confirm if you managed to fix the issue of the space at the bottom of your form? I checked it using chrome and it does not show the extra space anymore: 

    Inform us if you still need assistance with this inquiry.

    Thanks

  • Profile Image

    Answered by benzy16 on February 28, 2014 at 02:08 PM

    Just checked and its definatly still showing for me, cleared my cache as well so its not fixed yet.

    Thanks

  • Profile Image
    JotForm Support

    Answered by Mike_T on February 28, 2014 at 04:24 PM

    Can you please try the following iFrame to see if it fits right?

    <iframe id="JotFormIFrame" onload="window.parent.scrollTo(0,0)" allowtransparency="true" src="//form.jotformeu.com/form/40512894292356" frameborder="0" style="width:100%; height:670px; border:none;" scrolling="no"></iframe>

    It looks fine when I test it with Chrome Browser Web Development Tools:

  • Profile Image

    Answered by benzy16 on March 04, 2014 at 07:26 AM

    It worked! But now IE has some extra padding! It can never be simple with browsers can it!

  • Profile Image
    JotForm Support

    Answered by jonathan on March 04, 2014 at 08:30 AM

    Hi,

    Can you please tell us which version of IE browser you have encountered the issue.

    I checked it on my IE9 browser and it appears like this

     

    I can see that compared to Chrome view, the one in IE9 do have "a bit more" spacing at at the bottom. BUT you can agree that this is very minimal, which could be due to different browser's code.

    You can also try injecting CSS code on the form to dictate a specific height for it. 

    Example, you can try CSS code like this.

    .form-all{

    height: 670px !important;

    }

     

    Thanks.

  • Profile Image

    Answered by benzy16 on March 04, 2014 at 10:43 AM

    Any IE padding issues aside I now have the issue that the submit button does not show on my iPhone browser as the form box cuts off before it is shown

  • Profile Image

    Answered by pinoytech on March 04, 2014 at 12:08 PM

    I now have the issue that the submit button does not show on my iPhone browser as the form box cuts off before it is shown

    Request you to please create a separate thread with regards on your response for further assistance.

    Thanks,

  • Profile Image

    Answered by benzy16 on March 04, 2014 at 12:11 PM

    But this issue is caused by the iframe fix that Mike provided so we need a solution that appeases Chrome but doesn't cause an iPhone Safari issue

  • Profile Image
    JotForm Support

    Answered by TitusN on March 04, 2014 at 02:56 PM

    That is true.

    This thread has an open ticket, and we want to resolve the problem aside from the workaround Mike provided.

    We are all eager to help resolve it, but we cannot do it on this thread, but we have a reference, so opening a new thread will help us resolve the issue quicker.

    When you open the ticket, please place this link in the question: http://www.jotform.com/answers/339998-Excess-padding-margin-in-Chrome#10