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 find and reduce the padding of a field?Asked by Benflips on July 12, 2016 at 06:48 AM
Reference for this question: Page 3. the 'Which is?' field for preferred name, or the 'Spouse/Partner's Name?'
How do I choose a specific field - then reduce all of the padding so that it aligns horizontally with the field above it...
In this case so the 'which is?' lines up under 'Last' and the 'spouse/partner's name?' lines up under birth date?
I made an image to explain you how this can be done, basically you need to use the developers tool in order to get the code you will add, for example, you will need to click on the field and then click on inspect option, there you can add the code and add the padding then just copy and inject it in your form:
As shown in my screenshot, this is the code that you will use:
Please do note that you will need to change the value ( 0px ) in order to properly set the needed padding for your field, so you can either reduce or increase it as you need.
This guide will help you to inject the code to your form: How-to-Inject-Custom-CSS-Codes
Hope this helps.
This is so FRIGGING difficult for someone who doesn't know code.
Can I provide a list of these things that I need done and get you guys to
do it for me?
I feel like every attempt I make takes me 10min and doesn't necessarily
give me the outcome I want and I have to come back to you yet again for
I just tried to change the padding on the 'spouse/partner's name' field
below and it partly worked, but because of the relative width of the sex
field (i assume, the birth date field is just slightly out of alignment.
Changing the characteristics of a group of controls clearly is not the
answer. It seems this needs to be done field by field and it is painful!
*Dr. Ben Phillips*
Yes, you need to apply the code to each field, depending on the changes that you want to make, this is because not all the fields will be affected the same with the code, so you need to customize each field.
You can provide us the details about the changes that you want to get applied to your form, would be good to let us know each details so we can apply them on a cloned form and provide you with that so you can clone it or simply copy the code and paste it in your form.
If possible, please provide us some screenshots about how do you like fields to look, we will be glad to assist you with that.
I'm just heading off to lunch and then I will compile a list and provide
*Dr. Ben Phillips*
So...here is quite a long list of small 'tweaks' that I need to be done,
and I'm hoping you can do for me...
Page 1 -
Can you tell me how thevideo being set to 'must be watched'1. I put in some suggested code at one point to disable the (unused)
labels above checkboxes 2-5 under the privacy consent tab...so they 'look'
like they are all one set of checkboxes.
It appears that some other change we have applied since then has now
added extra space between each again, including space between the first
checkbox and it's label. I'd like this all reduced or compressed please.
2. For all check-boxes and radio buttons with TOP label alignment, can I
have the button or checkbox icon left-aligned directly under (or perhaps
only slightly indented) from the overlying label - currently it looks like
it is almost a centimetre in and it is too much.3. Please, in making this change, keep the earlier code that keeps the
wrapped text from the options aligned like they are at the moment, rather
than wrapping under the checkbox itself.
4. Perhaps provide a slightly increased gap between the icon and where
the option text begins - maybe another 3-5 pixels.
5. Can I have the name and date fields more 'centred' at the bottom of
the page (if not easy, please disregard)
6. I noticed that for these last elements on a given page, the hint text
'bubble' is 'cut off' at the bottom - can you find a fix for this please?