U rasporedu s više stupaca možete učiniti da se elementi šire po stupcima pomoću column-span.
h2 ( -webkit-column-span: all; column-span: all; )Dodijeli column-spanelementu unutar izgleda više stupaca kako bi postao opsežni element. Izgled više stupaca nastavit će se sa sljedećim elementom koji se ne proteže.
Vrijednost column-spanmože biti allili none.
Postavite element s column-span: alltako da obuhvaća stupce.
Vrijednost nonesvojstva je prekidač kill za obuhvaćajući element. Ovo biste mogli koristiti kada radite s medijskim upitima kako biste poručili elementu koji se proteže da prestane.
Pogledajte primjer raspona stupca olovke od CSS-Tricks (@ css-tricks) na CodePenu.
Podrška preglednika
Firefox to ne podržava column-span, ali postoje zanimljiva rješenja.
Evo podrške za raspored više stupaca općenito:
Podaci o podršci preglednika potječu iz tvrtke Caniuse, koja sadrži više detalja. Broj označava da preglednik podržava značajku u toj verziji i novijoj.
Radna površina
| Krom | Firefox | IE | Rub | Safari |
|---|---|---|---|---|
| 91 | 87 | 10 | 12 | 10 |
Mobitel / tablet
| Android Chrome | Android Firefox | Android | iOS Safari |
|---|---|---|---|
| 88 | 85 | 81 | 10,0-10,2 |
Ne zaboravite svoje prefikse!