Add a scrollbar to a textarea
What you need is overflow-y: scroll;
Demo
textarea { overflow-y: scroll; height: 100px; resize: none; /* Remove this if you want the user to resize the textarea */ }
<textarea></textarea>
Enable vertical scrolling on textarea
You can try adding:
#aboutDescription
{
height: 100px;
max-height: 100px;
}
Vertical scrollbar in a disabled textarea
Try it like this:
.clsTextArea {
height: 100px;
max-height: 100px;
overflow-y: scroll;
}
Showing vertical scrollbar always in a textarea field
Although it is not recommended, you can use padding. That way you'll always have a place to scroll to.
textarea {
height: 0px;
overflow-y:scroll;
padding-bottom: 200px; /*your height*/
}
The text will now always have padding at the bottom though, so you'll be able to scroll past the text content.
Remove scrollbars from textarea
Try the following, not sure which will work for all browsers or the browser you are working with, but it would be best to try all:
<textarea style="overflow:auto"></textarea>
Or
<textarea style="overflow:hidden"></textarea>
...As suggested above
You can also try adding this, I never used it before, just saw it posted on a site today:
<textarea style="resize:none"></textarea>
This last option would remove the ability to resize the textarea
. You can find more information on the CSS resize
property here
Vaadin: TextArea scrolling doesn't work
You can change it CSS also like below .
.v-textarea { overflow-y: auto ! important;}
Disable scroll on textarea
Just add in the css file:
textarea {
resize: none;
}
or:
<textarea rows="10" cols="45" placeholder="Animatie:" name="description" style="resize: none"></textarea>
Fiddle: https://jsfiddle.net/p6am6dze/2/
Issue with Text area scroll bar?
Set a fixed height
for textarea
and then add data-autogrow="false"
to prevent it from auto-growing.
CSS
textarea {
height: 150px; /* any value you want */
}HTML
<textarea data-autogrow="false">
<!-- text -->
</textarea>
Demo
Related Topics
CSS-Only Detection of Text Overflows in HTML
Keep Padding from Making The Element Bigger
How to Stop an Image Displaying Outside of The Div
Horizontal Line and Right Way to Code It in HTML, CSS
Inner Div with Square Ratio and Flexbox
Content of Div Is Longer Then Div Itself When Width Is Set to 100%
CSS3 Animation Not Working in Chrome
100% Width Background Image with an 'Auto' Height
Can Data-* Attribute Contain HTML Tags
Safari - Videos Load Far Too Slowly
What Does "<HTML Xmlns="Http://Www.W3.Org/1999/Xhtml">" Do
Negative Margins Vs Relative Positioning
How to Center a <Ul> with Left-Aligned <Li>S
Why Are CSS-Styles Not Inherited by HTML Form Fields
Equal Height Flexbox Columns in Chrome
Placing an Image to The Top Right Corner - CSS
Angular 2 Use a "Template" for Ng-Content to Use Inside Component Loop