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

    I created a form and the words in the questions appear in a long column, rather than across the top of the form.

    Asked by DrCynthia on March 31, 2014 at 05:06 PM

    I created a form and the words in the questions appear in a long column, rather than across the top of the form. Please help me. when i created the form it looks correct on your website, but the preview copy and the uploaded form look weird.

    thanks so much!

    Page URL:
    http://drcynthiamiller.com/application.html

    Screenshot
    long column and preview thanks
  • Profile Image
    JotForm Support

    Answered by jonathan on March 31, 2014 at 06:05 PM

    Hi,

    Please try increasing the width (from 120px to 320px) for the labels in the CSS code you have injected on the form.

    This code:

    .form-label-left, .form-label-top, .form-label-right{

    font-family: Arial, Verdana;

    text-shadow: 2px 2px 2px #ccc;

    display: block;

    float: left;

    font-weight: bold;

    margin-right:10px;

    width: 320px;

    line-height: 25px;

    font-size: 15px;

    }

     

    I tested this on the form and it appears like this

    Hope this help. Inform us if you need further assistance.

    Thanks!

  • Profile Image

    Answered by DrCynthia on March 31, 2014 at 07:40 PM
    Thanks so much! This worked. One more thing. When I opened the form on my
    website in Safari, part of the submit button is cut off.
    Thanks!
    I really appreciate your help!
    Cynthia
    ...
  • Profile Image

    Answered by DrCynthia on March 31, 2014 at 07:40 PM
    Oops, I forgot to all the screen shot in the email I just sent.
    Thanks so much! This worked. One more thing. When I opened the form on my
    website in Safari, part of the submit button is cut off.
    Thanks!
    I really appreciate your help!
    Cynthia
    ...
  • Profile Image

    Answered by Cesar on March 31, 2014 at 10:32 PM

    Please attempt to re-embedd the form utilizing the iFrame Method. If the issue perists after doing so, it may be the content area of your webpage may no t be long enought to display the form. 

    Do let us know if the issue persists after embedding the form using the iFrame Method. Thank you.

     

    Related Article:

    Getting-the-Form-iFrame-Code

  • Profile Image

    Answered by DrCynthia on April 01, 2014 at 03:10 PM
    Hello,
    I tried the iFrame Method and the submit button is still cut off, even after
    I made the form longer. Here is the screen shot.
    Thanks so much!
    Cynthia
    ...
  • Profile Image
    JotForm Support

    Answered by Mike_T on April 01, 2014 at 05:16 PM

    Please try to remove an auto-height script that is following the iFrame. Then, you will be able to set a custom height for the iFrame that is holding the form.

    Example:

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

    <script type="text/javascript">window.handleIFrameMessage = function(e) {var args = e.data.split(":");var iframe = document.getElementById("JotFormIFrame");if (!iframe)return;switch (args[0]) {case "scrollIntoView":iframe.scrollIntoView();break;case "setHeight":iframe.style.height = args[1] + "px";break;}};if (window.addEventListener) {window.addEventListener("message", handleIFrameMessage, false);} else if (window.attachEvent) {window.attachEvent("onmessage", handleIFrameMessage);}</script>

    Thank you.