Form not rendering properly when embedded

  • redtees
    Asked on March 24, 2015 at 7:23 PM

    Hello! I have embedded a form into a web page and cannot get the form to render properly. The field labels are above the fields and I've set them to be to the left. Also, I cannot figure out how to adjust the height of the form, tho if the labels were to the left and not above, the form wouldn't hang below my background banner. Here's the source code I've added to my page:  <script type="text/javascript" src="//form.jotform.us/jsform/50744246401145"></script>

     

    Can you help me figure out why this isn't rendering properly?

  • Charlie
    Replied on March 25, 2015 at 12:19 AM

    Hi,

    I see that you enable the option "Make this form responsive", this changes the layout of your form to adjust depending on the display of the device where it is being viewed at.

    Could you try re-embedding the form using the iFrame code instead? Here's how you can get that code: http://www.jotform.com/help/148-Getting-the-Form-iFrame-Code. We're using the iFrame to prevent the form to inherit the styling of the website and have it fixed.

    For the height of the form, you can adjust it on the iFrame code itself OR you could also use a custom CSS code. Here's an example code that you can use:

    .form-all {

    height: 700px !important;

    }

    You can adjust the height depending on your preferred one, add this code inside your Form Designer->CSS tab.

    Form not rendering properly when embedded Image 1 Screenshot 20

     

    I hope this helps. Do let us know if this works.

    Kind regards