A solution for the visual and source order disconnect
summary
A new CSS property reading-flow lets a flex or grid container switch tab order from source order to the visual layout with values like grid-rows or grid-columns or flex-visual so dense auto-placement and masonry stop producing a disconnected tab sequence; a companion child property reading-order lets one item be promoted without changing DOM. Implementation exists in Chrome Canary behind experimental web platform flags, the accessibility tree remains unchanged, and the property respects order, writing-mode and direction.
AI-written summary · about
chapters (8)
- 0:00Introduction and background
- 11:30Introducing Reading Flow
- 16:25How Reading Flow works
- 20:42Reading Flow with Grid
- 27:17Additional Reading Flow features
- 31:09Use cases and best practices
- 33:56Call for feedback and testing
- 34:16Q&A session
