The comment box that is four rows high and one row with text: every site with a textarea has shipped the JavaScript that measures input and grows the box. CSS has absorbed the job.

textarea {
  field-sizing: content;
  min-height: 3lh;
  max-height: 12lh;
}

What it changes

  • field-sizing: content sizes the control to its content, text included, so the box is never embarrassedly empty or sardine-tight.
  • min-height and max-height become the rails: past the maximum, a scrollbar appears as it should.
  • The unit lh keeps the rails honest in lines of text, not pixels you will regret under a different font size.
  • It also applies to input and select, where select with many options stops demanding a fixed height.

The one caveat to state plainly

  1. Browsers without the property keep the classic behavior: fixed height and manual scroll, which is every site's current state today, so nothing regresses.
  2. Pair it with a visible character count for enforced limits; auto-grow is visual comfort, not validation.
  3. Test with the tallest locale content you support; this site writes in four languages, and the French copy is reliably taller than the English.

A form detail that removes its own JavaScript, keeps focus behavior, and works with autofill: exactly the kind of platform work that makes small sites feel professionally tuned, gacor for one declaration.