Număr de coloane - CSS-Tricks

Anonim

Dacă aveți nevoie de un număr exact de coloane atunci când proiectați un aspect cu mai multe coloane, utilizați column-count.

.lead ( column-count: 3; )

Având în vedere numărul de coloane, browserul va distribui uniform conținutul în exact acel număr de coloane.

Această proprietate poate fi utilizată și în stenogramă columnsși poate fi utilizată în tandem cu column-width. Atunci când ambele proprietăți sunt declarate column-counteste numărul maxim de coloane.

Valori

column-countpoate fi autosau un număr întreg.

Folosiți autodacă utilizați și column-width. Gândiți-vă la asta ca la un mod de a spune browserului să lase să column-widthpreia conducerea.

Numărul întreg, cunoscut și ca număr de coloane, trebuie să fie mai mare sau egal cu 0.

Spre deosebire de column-widthaceastă proprietate, va deține numărul de coloane, indiferent de lățimea browserului. Aceasta înseamnă că, dacă ați tras un aspect cu 5 coloane pe telefonul dvs. mobil, veți avea un aspect foarte strâns cu 5 coloane pentru a naviga. column-countfuncționează cel mai bine alături column-width.

Suport pentru browser

Suport pentru aspectul cu mai multe coloane:

Crom Safari Firefox Operă IE Android iOS
Orice 3+ 1.5+ 11.1+ Peste 10 ani 81 3.2+

Nu uitați prefixele dacă nu utilizați deja un instrument care vă ajută deja.