CSS Field Sizing
field-sizing: contentlets form controls size themselves to their contents, replacing a common JavaScript textarea autoresize pattern when browser support is acceptable.
What It Does
field-sizing changes how default-sized form controls calculate their preferred size. With field-sizing: content, text inputs, selects, file inputs, and textareas can shrinkwrap or grow around their current content instead of staying at a fixed preferred size. The practical high-value case is a textarea that grows as the user types without input listeners, scrollHeight reads, or inline height mutation. Source: MDN, 2026-06-30
textarea {
field-sizing: content;
}
MDN marks the feature as Baseline 2026, Newly available since June 2026, supported by current Chrome/Edge, Firefox, and Safari versions. Treat it as a progressive enhancement for now: older browsers may still need the old JavaScript fallback or a fixed min-height/max-height layout. Source: MDN, 2026-06-30
Implementation Guidance
- Use it for autosizing comment boxes, chat composers, notes, and prompt inputs where the desired behavior is "fit the entered content."
- Pair it with explicit
min-block-sizeandmax-block-sizeso long text does not swallow the page. - Keep
resizepolicy intentional.field-sizing: contentchanges intrinsic sizing; it does not decide whether users should be allowed to manually resize. - Test constrained widths. Textareas grow in height when they cannot grow wider, and can still show scrollbars after a height cap.
- Do not remove existing JavaScript autosize until the target browser matrix is verified.
Source Artifact Read
The reviewed bookmark image contrasts a fixed textarea whose content overflows with a field-sizing: content textarea that expands to fit the message. The image is conceptually accurate but not a browser-compatibility source; MDN is the version/support authority. Source: local X image artifact, 2026-06-30
Timeline
- 2026-06-30 | Deep-reviewed @vponamariov's bookmark thread and local diagram; created focused page after verifying MDN Baseline 2026 support status. Source: X/@vponamariov, 2026-03-11; Source: MDN, 2026-06-30