Flexbox

Web design e UX

Flexbox (Flexible Box Layout) è un modulo CSS per layout unidimensionali che dispone gli elementi in modo flessibile in righe o colonne, ideale per design responsive. Nel web design , semplifica l'allineamento e la distribuzione; in ambito SEO, supporta l'ottimizzazione per dispositivi mobili.

Flexbox dispone gli elementi in una direzione, orizzontale o verticale, e distribuisce lo spazio disponibile tra di essi. Questo risolve problemi di layout su tre righe che in precedenza richiedevano l'uso improprio di tabelle o elementi flottanti.

La regola generale per distinguerli è: Flexbox per un asse, Grid per due. Un'intestazione con un logo a sinistra e la navigazione a destra è Flexbox. Una griglia di dodici schede con colonne e righe identiche è Grid. Chiunque costruisca tutto con Flexbox avrà difficoltà con le interruzioni di riga dalla seconda riga in poi; chiunque costruisca tutto con Grid si troverà in difficoltà con semplici righe.

Torna al glossario