Form control styling
summary
Demonstrates concrete CSS features and where they already land: a draft spec adds appearance: base to replace magic UA defaults so controls inherit fonts and colors; Chrome ships field-sizing: content (Safari tech preview enabled recently) to size inputs to content; new pseudo‑parts (check‑mark, slider‑thumb, file-selector-button) and a planned control-value() let CSS show live slider bubbles and style internal parts without JS. Most features are previews or drafts, not yet universal.
AI-written summary · about
chapters (18)
- 0:00Introduction
- 1:52Form control styling frustrations
- 5:19History of native form controls
- 9:36Branding with native controls
- 12:49Workarounds and flaws
- 15:20CSS form control spec
- 18:14Design principles for appearance
- 21:28Why defaults matter
- 21:48Form control sizing
- 23:39East Asian text layout
- 24:45Pseudo-elements for controls
- 25:47Number input future
- 27:52Checkbox styling
- 29:40Datetime input future
- 31:49Customizable select
- 32:32Sliders and value function
- 37:08CSS forms development
- 38:36Q&A
