JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.
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.
How to reduce the space between the last inventory row and the start of new section?Asked by Keithy on March 30, 2016 at 09:35 PM
Did I mention how awesome your help has been? Thank you for writing the custom code because I would have never been able to figure that out.Truly impressed with how quick and thorough your responses are.
With that being said, just one more question...lol. The space between the inventory rows is perfect, but now there is a big space after the last inventory row and start of new section...is there a way to fix that? If not, no worries as I don't want to break the code, but thought I would ask...
Thank you again!!
I'm glad my colleagues were able to help you on your form :)
Please allow me some time to review your CSS code and your form, I'll get back to you with a slightly modified one.
Here are my suggestions. They are quite a lot and it might take you a couple of minutes to do, but I believe this will make your form more organize and will allow us to easily modify it in the future if you need more help.
1. First, make sure that you have deleted the CSS code under the CSS tab in your Inventory widget settings. I noticed that some of your widgets have the same CSS code in their settings.
Here's what I am referring to:
2. After that, make sure that each widget has its "Label" option to "Disabled", some of your widgets have it disabled or enabled, which is causing some alignment issues because they don't have the same settings:
3. The last thing you need to do is replace the existing CSS code you have with this one:
margin-top : 0px !important;
margin-bottom : -1px !important;
padding-top : 0px !important;
padding-bottom : 0px !important;
max-height : 50px !important;
Assuming that you do not have any other widgets, this would be a simpler code to use with the same effect. Here's a screenshot to where you need to paste it. Make sure to remove all the other existing code that refers to the widget.
Here's my cloned form with those changes: https://form.jotform.com/60901296234958
Let us know if that works for you.
Holy smokes, you rewrote the code and it's a lot more condensed. Thank you for fixing the form it looks fantastic. I love it and appreciate that you did all of the heavy lifting so that I can just clone the form!
No worries, I'm glad it helped. If you are just cloning my form, I strongly advise that you open each widget and click the "Update Widget" button. This is because the widget in my form is using my own API, if you clone it you'll need to apply your account's own API, however, that doesn't seem to happen automatically after you clone the form, you need to open the widgets and just click the "Update Widget" button, that will automatically re-apply your own API key to the widget.
Here's a screenshot, noticed that your form is showing errors regarding the API:
Let us know if that helps.