Hvis du trenger et nøyaktig antall kolonner når du designer et layout med flere kolonner, bruk column-count.
.lead ( column-count: 3; )Gitt antall kolonner, vil nettleseren jevnt distribuere innholdet i akkurat det antall kolonner.
Denne egenskapen kan også brukes i stenografi for columnsog kan brukes sammen med column-width. Når begge egenskapene er deklarert, column-counter det maksimale antallet kolonner.
Verdier
column-countkan være autoeller et helt tall.
Bruk autohvis du også bruker column-width. Tenk på det som en måte å fortelle nettleseren om å la column-widthta ledelsen.
Heltallet, også kjent som antall kolonner, må være større enn eller lik 0.
I motsetning til column-widthdenne egenskapen vil det inneholde antall kolonner uavhengig av nettleserbredden. Dette betyr at hvis du trakk opp et 5-spaltet layout på mobiltelefonen din, vil du ha et veldig pyntet 5-spaltet layout å navigere. column-countfungerer best ved siden av column-width.
Nettleserstøtte
Støtte for layout med flere kolonner:
| Chrome | Safari | Firefox | Opera | DVS | Android | iOS |
|---|---|---|---|---|---|---|
| Noen | 3+ | 1,5+ | 11.1+ | 10+ | 81 | 3.2+ |
Ikke glem prefiksene dine hvis du ikke bruker et verktøy som allerede hjelper med det.