textarea height code example

Example 1: html textarea height

<!-- textarea rows attribute -->
<textarea id="txtid" name="txtname" rows="4" cols="50" maxlength="200">
A nice day is a nice day.
Lao Tseu
</textarea>

Example 2: fix textarea size

resize: none;

Example 3: textarea only one line

textarea {
  resize: none;
  white-space: nowrap;
  overflow-x: scroll; /* or hidden */
}

Example 4: syntax is being placed in my textarea in html

<textarea name="comment" rows="5" cols="100"></textarea></br></br>

Example 5: html set textarea value

// To set the textarea value, you must insert the TEXT into the element.
<textarea>VALUE</textarea>
// javascript
var textarea = `<textarea>${value}</textarea>`;
document.getElementById('my_textarea_id').textContent = 'foo'
// php
$value = 'foo';
$textarea = "<textarea>$value</textarea>";
echo $textarea;

Example 6: html textarea auto height to amount of text

$('textarea').each(function () {
  this.setAttribute('style', 'height:' + (this.scrollHeight) + 'px;overflow-y:hidden;');
}).on('input', function () {
  this.style.height = 'auto';
  this.style.height = (this.scrollHeight) + 'px';
});