Horje
How to crearte HTML textarea auto expand height | HTML Form Code
How to crearte HTML textarea auto expand height

When You will write anything on textarea. It will auto height expand.


CSS Code

CSS Style Code for Textarea
style.css
Example: CSS
<style>
textarea {
  resize: none;
  overflow: hidden;
  min-height: 50px;
  max-height: 100px;
}    
</style>

Javascript Code

Javascript Code for making expand textarea when Wirte
script.js
Example: JAVASCRIPT
<script>
function auto_grow(element) {
  element.style.height = "5px";
  element.style.height = (element.scrollHeight) + "px";
}    
</script>

Full Completed Code for HTML textarea auto expand height

index.html
Example: HTML
<script>
function auto_grow(element) {
  element.style.height = "5px";
  element.style.height = (element.scrollHeight) + "px";
}    
</script>
<style>
textarea {
  resize: none;
  overflow: hidden;
  min-height: 50px;
  max-height: 100px;
}    
</style>
<textarea oninput="auto_grow(this)">
</textarea>

Output should be:

Full Completed Code for HTML textarea auto expand height



Read Full::
HTML Form Code
Category:
HTML Tutorial Code
Sub Category:
HTML Form Code
Uploaded:
4 months ago
Uploaded by:
Admin
Views:
3

Related Articles
How to crearte HTML textarea auto expand height HTML Form Code

Single Articles
CSS Code
Javascript Code
Full Completed Code for HTML textarea auto expand height

Share on: