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

    Question 2Is there any way of compressing the fields of the form, so that it has less height .. it seems quite vertically spread out

    Asked by jonsynergy on January 07, 2017 at 09:43 AM
    There is a 'click on' collapsible button on the right hand side of the page .. is there any way of replacing this button with an image of my own choosing, so that people can just click on the image?
  • Profile Image
    JotForm Support

    Answered by KadeJM on January 07, 2017 at 11:57 AM

    It looks like Helen already answered your question in the other thread about replacing the collapse button with an image and meant to split this one as a new question about field compression to lessen the height of your form which is certainly possible.

    There are a couple of ways to do that.

    You can adjust the question spacing or you can also adjust the form line and margins with css and both of those are mentioned here https://www.jotform.com/help/62-How-Can-I-Change-Spacing-Between-Questions .

    Alternatively, you can embed your form with an iframe then just change the height value in the code.

  • Profile Image

    Answered by jonsynergy on January 07, 2017 at 12:11 PM

    Hi, I think my previous question was misunderstood.

    I have changed the picture and url and dimensions in the CSS below but the outcome doesn't look right. The image is not displayed properly and the background of the button is much wider.. I would really appreciate you help, thanks. John

     

    div#collapse_22 {

        background : url(http://www.laboratorymarkets.com/img/report_enquiry.png) no-repeat;

        background-size : 207px 290px;

    }

    See the webpage below

    http://www.laboratorymarkets.com/Report_description.asp?startingPoint=0&interval=10&id=3336&s=&ss=&i=&search=ks&keywords=&searchtype=Reports

  • Profile Image
    JotForm Support

    Answered by KadeJM on January 07, 2017 at 03:26 PM

    I apologize about any confusion that may have occurred and thank you for clarifying this more as well as the provided example and link that you're using now.

    I believe I see what you are referring to where the collapse is extended outside of the form some which is also similar on your form as well.

    To fix this issue you just need to add in an extra line of css to adjust the form collapse width.

     

    Try this:

    div#collapse_22 {

        background : url(http://www.laboratorymarkets.com/img/report_enquiry.png) no-repeat;

        background-size : 207px 290px;

        width : 380px;

    }