Categoria

anchor positioning

4 articoli associati a questo tag.

24 settembre 2026

State queries in CSS nel 2025: UI reattive senza JavaScript

Le container queries hanno cambiato il modo di costruire componenti riusabili. Nel 2025 si spingono oltre con le state queries: puoi applicare stili quando un elemento è sticky e “stuck”, quando uno slide è snapped, o quando un contenitore è davvero scrollabile—in CSS, senza listener e calcoli. In più, si intravede un futuro interessante con le anchored container queries per adattare tooltip e popover ai fallback di anchor positioning.

27 agosto 2026

Underline “magico” in CSS con Anchor Positioning: l’effetto che prima era un incubo, ora sono poche righe

Creare un underline o un evidenziatore animato che “insegua” le voci di una nav era spesso un esercizio di pazienza: misure, offset, resize, layout che cambia. Con CSS Anchor Positioning puoi ancorare un pseudo-elemento a un elemento e farlo saltare automaticamente sull’ultimo anchor attivo (es. il link in hover/focus), con animazioni fluide e anche un tocco di blur/glass se vuoi.

1 luglio 2026

Popover nativi in HTML con animazioni fluide (senza JavaScript)

I popover nativi sono finalmente pratici: si attivano con un attributo sul bottone, si chiudono con click esterno o Esc, finiscono nel “top layer” (niente lotte di z-index) e possono essere animati in modo credibile anche se partono da display:none. In questo articolo vediamo come collegarli, come evitare i gotcha dei CSS di default, come posizionarli vicino al trigger con anchor positioning (progressive enhancement) e come ottenere transizioni diverse tra apertura e chiusura grazie a @starting-style e transition-behavior: allow-discrete.