State changes don't move the page
Reserve space so loading, toggles and validation don't shift surrounding content.
Draft — not yet reviewed by a maintainer
Why it matters
Content that jumps makes people lose their place and click the wrong thing. Reserving room for text that appears keeps the page still.
How to check it
Switch every state at 1440 and 390: nothing else moves (CLS under 0.1).
The default it guards against
Error text inserted above a field that pushes the form down, or a billing note that appears only for annual billing and shifts the buttons.
Library items that apply it
Where it comes from
- docs/quality-gates.md (Interaction: loading controls don't resize)
- docs/quality-gates.md (Media and performance: CLS under 0.1)
Repository paths refer to the Tessli repository ; WCAG references are to WCAG 2.2.