-
jonsynergyAsked on January 7, 2017 at 9:43 AM
-
KadeJMReplied on January 7, 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.
-
jonsynergyReplied on January 7, 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
-
KadeJMReplied on January 7, 2017 at 3: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;
}