-
BenflipsAsked on July 10, 2016 at 7:40 PM
Hi...I have asked multiple times about field widths, but have always been referred to your basic guide with grow/shrink/new line etc.
This is not helpful now as I want to try to align the disparate elements throughout my form.
Can you help me understand the difference between a field width versus the acutal text entry part of a field?
I've learnt (sometimes) to be able to change field widths in designer but this doesn't seem to automatically alter the 'white - space' that is the bit I really want to align - some are shorter than others and it sticks out like a sore thumb and looks crap.
I can't seem to select an individual white-sapce element within designer or the desiner css panel - any change I make to width changes the entire field and starts pushing subsequent elements on the same line to a new line!
-
BenflipsReplied on July 10, 2016 at 8:34 PM
I can't seem to select or change the date field 'white-space' - I can select the field itself, but not just the data entry section.
Similarly, with dropdowns - an example is the Title dropdown in Page 2. I want to view the full message 'Please Select'
-
BenflipsReplied on July 10, 2016 at 8:37 PM
-
Kiran Support Team LeadReplied on July 11, 2016 at 1:12 AM
Please be noted that the changing the width from the Design tab of Form Designer will effect all the text-box and textarea fields on the form. If you need to change the width of any particular field, it is easier to change it from the CSS tab. Open the CSS tab and click twice on the field that you want to change the field or part of the field like date field/full name fields. Please see the screencast below that can help you with this.
You may change other parameters from the CSS section. However, it is required to have some knowledge in CSS. Hope this information helps!
If you are referring to something different, please let us know. We will be happy to help.
The other question related to Form collapse tool is moved to a separate thread and shall be addressed there shortly.
https://www.jotform.com/answers/879425
Thank you!
-
BenflipsReplied on July 11, 2016 at 2:46 AMI tried to be clear in my earlier post about some of my challenges...
I understand the difference of using the designer versus the CSS tab.
Within the CSS tab I understand the difference between selecting and
individual field/control, versus a whole class of controls.
My problem is that I select a field, say to expand it's width, but I cannot
seem to find a way to select the 'white space' actual form-entry section of
the field.
An example would be the date fields and the phone number fields - something
has happened to them and I can't seem to make them the proper width any
more.
Or for example on page 2 of my form, I want the 'form entry' white box of
"Where did you find out Ad" to match the same width(length?) as the "So how
did you find out about us" above it
*Regards,*
*Dr. Ben Phillips*
Chiropractor
B.App.Sc.(Comp.Med.)(Chiro) M.Clin.Chiro.(RMIT)
... -
Ashwin JotForm SupportReplied on July 11, 2016 at 7:27 AM
Hello,
An example would be the date fields and the phone number fields - something has happened to them and I can't seem to make them the proper width any more.
I have fixed this issue in your form. It was caused because of the following custom css code you injected in form:
#id_29 {
width : 250px;
}
I changed the width to 400px and that fixed this issue.
Or for example on page 2 of my form, I want the 'form entry' white box of "Where did you find out Ad" to match the same width(length?) as the "So how did you find out about us" above it.
Please inject the following custom css code in your form and that should solve this issue:
input#input_50 {
width: 250px !important;
}
Hope this helps.
Do get back to us if you have any questions.
Thank you!
-
BenflipsReplied on July 12, 2016 at 12:45 AMThere are multiple date fields, not just the first one that have this
problem.
But I can't see them in designer view to select them and change their CSS!
(They are conditionally hidden)
*Regards,*
*Dr. Ben Phillips*
Chiropractor
B.App.Sc.(Comp.Med.)(Chiro) M.Clin.Chiro.(RMIT)
... -
Ashwin JotForm SupportReplied on July 12, 2016 at 3:00 AM
Hello,
Please inject the following custom css code in form and that should solve your problem:
[data-type="control_datetime"] .form-sub-label-container {
width: 85px;
}
Do try it out and get back to us if the issue persists.
Thank you!
-
BenflipsReplied on July 12, 2016 at 3:45 AMDone. Worked. Thank you
*Regards,*
*Dr. Ben Phillips*
Chiropractor
B.App.Sc.(Comp.Med.)(Chiro) M.Clin.Chiro.(RMIT)
... -
Ashwin JotForm SupportReplied on July 12, 2016 at 4:18 AM
Hello,
You are welcome.
I am glad to know that your issue is resolved.
Do get back to us if you have any questions.
Thank you!