Skip to main content
📄 HTML & the platform·Module A3 · Lesson 7
TaskBuild a feedback form: <label for='msg'>Message</label> + <textarea id='msg' name='message' rows='5' maxlength='1000' placeholder='Tell us'></textarea>.

<textarea>: multi-line text

60 XP5 min
Theory

The two attributes worth knowing

<textarea name="bio" rows="4" cols="40" placeholder="Tell us about yourself" maxlength="500"></textarea>
  • rows — visible lines (height hint). Browser still allows scrolling beyond.
  • cols — visible columns (width hint). Most modern designs override with CSS width: 100% instead.
  • maxlength — hard cap on characters, same as <input>.
  • placeholder — gray hint shown when empty.

NOT self-closing

<textarea /> doesn't work the way <input /> does. <textarea> must have an opening and closing tag — and the initial value goes between them:

<textarea name="message">Default text here</textarea>

White space matters — leading/trailing newlines inside the tag are included in the value.

Resize via CSS, not HTML

textarea { resize: vertical; }   /* allow vertical drag only */
textarea { resize: none; }       /* disable drag handle */

resize: both is the browser default. Disable horizontal resize on narrow layouts to prevent users from breaking your design.

🔒

Sign up to start coding

Theory is open to everyone. The interactive editor, live preview, and check are unlocked with a 7-day free trial — card required, cancel anytime.

Sign up — free trial →

First 15 lessons in each track are free. No card needed for those.

PreviousNext lesson →

Get one Python or web tip a day — by email

Short, hand-written, no spam. Unsubscribe in one click.