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 to create a form like in this image?

    Asked by StuartG94 on March 03, 2014 at 10:59 AM

    Hello, I'm just wondering how I can create a fomr like you see in this image http://i59.tinypic.com/qxl21h.jpg, when I shrink the text area and text boxes, it looks right except I can't place the three text boxes under each other without there being a large gap because the text area has much more height.

    create a form create height shrink jpg
  • Profile Image

    Answered by Carina on March 03, 2014 at 11:18 AM

    I couldn't access the url you posted. I kindly ask you to follow our guide on how to upload screenshots to our forum, so we can assist you better.

    Thank you

     

  • Profile Image

    Answered by StuartG94 on March 03, 2014 at 11:21 AM

     

    Sorry about that, here is the image I posted!

  • Profile Image

    Answered by Carina on March 03, 2014 at 12:53 PM

    Please inject the following css code:

     

    #input_3, #input_4, #input_5, #input_6, #input_7, #input_9

    {

    width:250px;

    }

    #id_4

    {

    position:relative;

    top:-75px;

    }#id_5

    {

    position:relative;

    top:-80px;

    }#id_6

    {

    position:relative;

    top:-90px;

    }

    #id_9

    {

    position:relative;

    top:-170px;

    }

    #id_8

    {

    position:relative;

    top:-165px;

    }

    #id_2

    {

    position:relative;

    top:-160px;

    }

    .form-line {

    margin-bottom: 0;padding-bottom: 0;}

     

    Or you can clone this test form:

    http://form.jotformpro.com/form/40614330598959

    Let us know please if you need more assistance.

  • Profile Image

    Answered by StuartG94 on March 04, 2014 at 07:00 AM

    Hello, yeah that's exactly what I'm looking for, however when I am resizing the form to a width of 460px and trying to resize everything to fit into it nicely the text boxes, etc. just seem to go everywhere and I can't seem to line it up how you have.

    How can I put it into a form with the width of 460 pixels?

  • Profile Image
    JotForm Support

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

    Hi,

    If you resize the form width(which you easily do using its width property) , you will need to adjust also the field's width so that the do not move out of position due to the decrease in the width.

    If you add the CSS code like this 

    .form-all{

    width:460px !important;

    }

    it will set your form's width to 460px

    I suggest you also review the technique described on this thread where the form is resized using iframe name tag.

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

    Thanks.

  • Profile Image

    Answered by StuartG94 on March 04, 2014 at 08:34 AM

    I have done that already, but I am having a problem, how can I resize the captcha?

  • Profile Image
    JotForm Support

    Answered by ashwin_d on March 04, 2014 at 09:19 AM

    Hello StuartG94,

    I did check few of your last edited form but could not find any captcha field to be able to give you exact custom css code. Anyway but captcha css will work in any form as the css class remains same(not applicable for reCaptcha). In my colleague's form which she have shared above:  http://form.jotformpro.com/form/40614330598959, please use the following custom css to resize the captcha field:

    .form-captcha, .form-captcha-image,  .form-captcha input{

    width: 200px !important;

    min-width:200px !important;

    max-width:200px !important;

    }

    Do check this and get back to if you have any questions.

    Thank you!

  • Profile Image

    Answered by StuartG94 on March 04, 2014 at 11:12 AM

    Hello, I seem to be having some problems still, in the picture on the left is how it looks in jotform and on the right is how it looks on the website 

    How can I line these up correctly?

  • Profile Image

    Answered by pinoytech on March 04, 2014 at 11:22 AM

    Hi,

    Can you please share to us URL of your form for further assistance?

    Thanks,

  • Profile Image

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

    Anyways, I've clone one of your form and modified it. Kindly take a look at this form: http://www.jotformpro.com/form/40624313697961

    Feel free to clone the form and use it.

  • Profile Image

    Answered by StuartG94 on March 07, 2014 at 04:42 AM

    Hey pinoytech, thats great thank you very much but it comes up all wierd on Safari on OS X? do you have a solution, it turns out the client is using a Mac so we need this one sorting if you would be so kind to help.

    http://tandgwebdesign.co.uk/midaslaw.png

  • Profile Image

    Answered by StuartG94 on March 07, 2014 at 06:57 AM

    Could anyone help me with this issue? Sorry to rush you, but the customer is panicking

  • Profile Image

    Answered by EliezerN on March 07, 2014 at 09:46 AM

    @StuartG94

    We would appreciate if you open a new thread to post your last inquiry as this is different from the original one of this thread. Once you open the new thread we will repy to you as soon as possible with the solotion to the issue.

    Thanks

  • Profile Image

    Answered by StuartG94 on March 07, 2014 at 11:01 AM

    Hi guys I have opened a new thread as requested but I have not had a reply yet. If anyone has a solution please post your solution here http://www.jotform.com/answers/343527-How-can-I-make-this-form-display-correctly-on-Safari#0

  • Profile Image

    Answered by pinoytech on March 07, 2014 at 12:25 PM

    @StuartG94,

    I've already responded your query. Please refer on this thread: http://www.jotform.com/answers/343527

    Thanks!