Le nuove unità di visualizzazione CSS sono una delle mie caratteristiche preferite nei moderni CSS.

La maggior parte dei telefoni oggi ha diverse interfacce utente nel browser, come iPhone con la barra degli URL in basso, Android con pulsanti di navigazione, ecc.

Ciò può portare a problemi dell’interfaccia utente che le tradizionali unità “vh” in CSS non risolvono, come problemi di scorrimento o elementi bloccati sotto l’interfaccia utente del browser.

Le nuove unità viewport sono una soluzione molto più elegante a questo problema:

→ L'”altezza più piccola del viewport” (svh) si adatterà sempre alla minima quantità di spazio (tutto il contenuto sarà sempre visibile)
→ L'”altezza massima del viewport” (lvh) occuperà sempre la maggior quantità di spazio (nascondendo potenzialmente alcuni contenuti sotto l’interfaccia utente)
→ L'”altezza della finestra dinamica” (dvh) verrà ridimensionata per adattarsi allo spazio attualmente disponibile (adattandosi man mano che l’interfaccia utente del browser diventa visibile o nascosta)

Il supporto per i browser sembra molto solido ora, quindi sono sicuramente pronti per il tuo prossimo progetto