W układzie wielokolumnowym możesz rozszerzyć elementy w kolumnach za pomocą column-span.
h2 ( -webkit-column-span: all; column-span: all; )Przypisz column-spando elementu wewnątrz układu wielokolumnowego, aby stał się elementem obejmującym. Układ wielokolumnowy zostanie wznowiony z następnym nieprzekraczającym elementem.
Wartość column-spanmoże wynosić alllub none.
Ustaw element za pomocą, column-span: allaby obejmował kolumny.
Wartością nonewłaściwości jest wyłącznik awaryjny elementu rozpinającego. Możesz tego użyć podczas pracy z zapytaniami o media, aby nakazać elementowi rozpinającemu, aby przestał się rozpinać.
Zobacz przykład zakresu kolumn Pen autorstwa CSS-Tricks (@ css-tricks) w CodePen.
Wsparcie przeglądarki
Firefox tego nie obsługuje column-span, ale istnieją interesujące obejścia.
Oto ogólne wsparcie dla układu wielokolumnowego:
Te dane dotyczące obsługi przeglądarek pochodzą od Caniuse, który zawiera więcej szczegółów. Liczba wskazuje, że przeglądarka obsługuje tę funkcję w tej wersji i nowszych.
Pulpit
| Chrom | Firefox | TO ZNACZY | Brzeg | Safari |
|---|---|---|---|---|
| 91 | 87 | 10 | 12 | 10 |
Telefon komórkowy / tablet
| Android Chrome | Android Firefox | Android | iOS Safari |
|---|---|---|---|
| 88 | 85 | 81 | 10,0-10,2 |
Nie zapomnij o swoich przedrostkach!