Auto-Growing Textarea
The .c-textarea-auto grows to fit its content using
field-sizing: content (Chrome 123+). No JavaScript auto-resize.
Semantic HTML
<textarea class="c-textarea-auto" rows="2"></textarea>
Progressive enhancement
Where field-sizing: content is not supported, the textarea retains its
rows attribute (fixed height).
Max height cap
Cap the growth with --c-textarea-max-block:
<textarea
class="c-textarea-auto"
style="--c-textarea-max-block: 8rem;"
></textarea>
Beyond the cap, the textarea scrolls instead of growing.