The “Other” C in CSS
summary
Concrete claims and concrete fixes: CSS changes the accessibility tree (role, name, presence) with examples — Safari removing list semantics when markers are stripped, longstanding display:contents bugs, and seven different ways to hide elements. Demonstrations show a working technique to hide native checkboxes for touch users (position:absolute + opacity:0 over the visual SVG), problems with pseudo labels on file inputs, and the new CSS generated content alt text spec whose browser support is inconsistent so HTML or JS fallbacks are required.
AI-written summary · about
chapters (19)
- 0:00Introduction
- 1:08CSS and accessibility
- 2:10Accessibility tree basics
- 5:17CSS affects accessibility tree
- 8:28Hiding elements accessibility
- 11:20Visually hidden class
- 15:33Hiding interactive elements
- 19:23CSS impact on names
- 25:25Generated content and screen readers
- 31:48Avoid CSS for content
- 35:16Styling file inputs
- 36:59CSS strips accessible names
- 39:47CSS does not affect state
- 40:52CSS-only widgets accessibility
- 44:42Popover API limits
- 47:30Focus management violations
- 49:36Least power in CSS
- 51:42User needs over DX
- 52:04Q&A
