Form not displaying full height in Chrome (cut off)

  • Profile Image
    Debwork
    Asked on March 06, 2015 at 01:47 PM

    Hello,

    Site has 2 forms, one shows up in Chrome and the other has a big problem in Chrome.

    Good:

    http://www.thirdstreetshoe.com/contact-madison-shoe-repair/

    Not good:

    http://www.thirdstreetshoe.com/order-shoe-repair-by-mail/

    Tried it with a plugin but now code is...

    <code><script src="//form.jotformpro.com/jsform/...the number123" type="text/javascript"></script></code>

     

    Screenshot

     

  • Profile Image
    Debwork
    Answered on March 06, 2015 at 01:48 PM

    <code> is not on the page... thought I needed it to post!

  • Profile Image
    Kiran
    Answered on March 06, 2015 at 03:46 PM

    I see that you are using WordPress for your website and the forms are embedded using normal JavaScript method. Could you try embedding the JotForm using the JotForm WordPress plugin?

    Let us know if the issue still persists. We will be happy to look into this issue further. 

    Thank you!

  • Profile Image
    Debwork
    Answered on March 06, 2015 at 04:51 PM

    Using the plugin the form is visible but not 100% vertically visible without scrolling.

    Client will not approve of scroll bars...  vertical appears in all viewports, horizontal scroll bars are added in smaller devices and vertical view gets even smaller... can only see a few fields!

    http://www.thirdstreetshoe.com/order-shoe-repair-by-mail/

     

    here is a screenshot

  • Profile Image
    Shadae
    Answered on March 06, 2015 at 06:42 PM

    Hi Debwork,

    I was able to see that not all of your form is visible within the frame and it does have a scroll bar to access the rest of the form.

    Another option that can be used, is embedding your form using the iFrame embed code:

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

    You can adjust the height in the code to ensure that the entire form is showing.

    I hope this helps, please inform us if you need further assistance.

  • Profile Image
    Debwork
    Answered on March 07, 2015 at 01:39 PM

    How do you set height for responsive design?

    Rats, maybe I have to switch it to Gravity forms (sad)

  • Profile Image
    Shadae
    Answered on March 07, 2015 at 02:49 PM

    Hi Debwork,

    Please attempt to embed your form using the following code:

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

    This should resolve the issue that you are experiencing. If parts of your form are still cut off please adjust the height that is highlighted in purple.

    Please feel free to contact us if you need further assistance.

    Thank you.