Non è retorico: sono davvero interessato a trovare ottimi casi d'uso per i layout a più colonne CSS.
La risposta sembra semplice. Usa le colonne quando vuoi dividere qualsiasi contenuto in colonne, giusto? Questo è generalmente il tipo di esempio che troverai negli articoli che mostrano come funzionano i layout a più colonne CSS, incluso il nostro Almanacco:
Proprio su. Ma è un caso d'uso reale? Mmmm forse. Se il testo è relativamente breve, allora forse è un bel tocco. È così che l'ho venduto a me stesso durante la riprogettazione del mio sito Web a qualche anno fa. Oggi non è così, ma ecco come appariva allora:
Ma un intero articolo lungo diviso in colonne? Lo adoro sui giornali, ma sono riluttante a scorrere una pagina Web verso il basso per leggere una colonna, solo per tornare indietro per farlo di nuovo.
Suppongo che possiamo usarlo per posizionare due elementi fianco a fianco, ma flexbox è molto più adatto a questo. Inoltre, una limitazione ci impedisce di selezionare le colonne per ridimensionarle individualmente. Le colonne devono essere della stessa larghezza.
Una cosa che le colonne hanno per loro è che sono l'unico metodo di layout CSS che frammenti contenuto. (Cioè, a meno che non stiamo contando Regioni CSS... che ne è stato di quelli, comunque?!) Quindi, se vuoi dividere un paragrafo in colonne, è già possibile senza wrapper aggiuntivi.
In quale altro caso potresti dover dividere un blocco continuo di contenuti in colonne? Ricordo che dovevo farlo quando avevo un vecchio elenco di articoli non ordinato. Mi piace il modo in cui gli elenchi possono semplificare la scansione dei contenuti, ma gli elenchi lunghi possono far sembrare un lato della pagina molto pesante. Diciamo, ad esempio, che stavamo elencando tutti i tag post per CSS-Tricks in gruppi alfabetici. Un layout a più colonne funziona magnificamente per questo:
Vai avanti e prova a ridimensionare la larghezza della finestra. Sono definite tre colonne, ma il numero cambierà in base alla quantità di spazio disponibile. Devo amare tutta quella bontà reattiva senza il lavoro di query sui media!
Stavo lavorando a una demo per il :left pseudo-classe e raggiunto columns perché è un ottimo modo per frammentare le cose per la stampa di demo. Quindi, immagino che ci sia un altro caso d'uso. E durante la realizzazione di una demo, mi sono reso conto che un layout a più colonne poteva essere utilizzato per creare una griglia di elementi in muratura, come una galleria di immagini:
Ma cos'altro? Siamo limitati a brevi paragrafi, lunghi elenchi e griglie a flusso libero?
