Sometimes a single line of text is not enough. When you want your users to write a message, a review, a comment, or anything longer than a sentence, reach for the <textarea> tag.
The Textarea Tag
Unlike <input>, <textarea> is not a self-closing tag. It has an opening and a closing tag, and any text between them appears as the default content. It also accepts text that spans multiple lines by default.
<textarea name="message" rows="5" cols="40">
Write your message here...
</textarea>
Rows and Cols
rows controls how many lines of text are visible before scrolling. cols controls the visible width in characters. You can also resize a textarea by dragging the bottom-right corner in most browsers, though you can disable that with CSS if you prefer a fixed size.
Multiline Input in Action
Textareas are perfect for comment boxes, contact forms, bio fields, or any place where you expect a paragraph or two. They wrap text naturally, so the user does not have to keep hitting Enter.
<form action="/submit-comment" method="POST">
<p>Leave your comment:</p>
<textarea name="comment" rows="6" cols="50"></textarea>
<br>
<button type="submit">Post Comment</button>
</form>