Horje
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



How to crearte HTML textarea auto expand height Image Gallery



Related Articles
How to crearte HTML textarea auto expand height HTML Form Tutorial
How to use multiple values in HTML Select Option Tag? HTML Form Tutorial

Single Articles
CSS CodeHTML Form Tutorial
Javascript CodeHTML Form Tutorial
Full Completed Code for HTML textarea auto expand heightHTML Form Tutorial

Read Full:
HTML Form Tutorial
Category:
Web Tutorial
Sub Category:
HTML Form Tutorial
Uploaded:
11 months ago
Uploaded by:
Admin
Views:
32



Share on: