-
BenflipsAsked on July 8, 2019 at 7:31 PM
Hi - a long time ago I had some text boxes on my form that were set to a particular height, and had a scroll bar visible to read all of the content.
Could you please provide me with a sample of such code again?
I know how to use developer tools to identify the text box.
I just need to know how to force-set the height of the box, and then have a scroll bar visible and functional.
Thanks in advance.
-
Ashwin JotForm SupportReplied on July 8, 2019 at 10:05 PM
Instead of adding a textbox field, you should add a text area / long text entry field in form. This will display a scroll bar if the text content exceed the textarea height. You can also set the number of rows in the long ext entry field as well. Please check the screenshot below:
Hope this helps.
Do try it out and get back to us if you have any question.
-
Victoria_KReplied on July 9, 2019 at 2:39 AM
Hi!
Can you please let us know what is the form and field in it to apply codes to?
Basically, you can use something like this:
.form-html {
height: 100px;
overflow-y: scroll;
}
Guide: How-to-Inject-Custom-CSS-Codes
-
BenflipsReplied on July 9, 2019 at 6:21 PM
I will try this.
However I would ideally like code that I can apply to just one given text field, rather than something that will apply to the entire form.
I would also like to be able to colour the border and put in a border radius of 20px.
And I would like the scroll bar to be permanently visible - in the suggestion above, it looks like the scroll bar is only visible when a client actively is navigating over the text field.
-
David JotForm Support ManagerReplied on July 9, 2019 at 7:54 PM
It is possible to target the specific text field, you can inspect the element to find the ID:
So, this would be the code to target just that html field: https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes
#id_16 .form-html {
height: 100px;
overflow-y: scroll;
}
In regards to setting a color to the border, and also a border radius, please try with this code:
#cid_16{
border: solid 6px;
border-color: blue;
border-radius: 8px;
}
Result: https://form.jotform.com/91897331500962
In regards to the scrollbar visibility, I have checked it in Chrome and Firefox browser, and it shows all the time. What browser are you using?