Στήλη-εύρος - CSS-Κόλπα

Σε μια διάταξη πολλών στηλών, μπορείτε να κάνετε τα στοιχεία να επεκταθούν στις στήλες με column-span.

h2 ( -webkit-column-span: all; column-span: all; )

Αντιστοιχίστε column-spanσε ένα στοιχείο στο εσωτερικό της διάταξης πολλών στηλών για να το κάνετε ένα στοιχείο που εκτείνεται. Η διάταξη πολλαπλών στηλών θα συνεχιστεί με το επόμενο στοιχείο που δεν εκτείνεται.

Η τιμή column-spanμπορεί να είναι allείτε none.

Ορίστε ένα στοιχείο με το οποίο column-span: allθα το ανοίγει στις στήλες.

Η τιμή noneγια την ιδιότητα είναι ο διακόπτης kill για ένα στοιχείο spanning. Μπορείτε να το χρησιμοποιήσετε όταν εργάζεστε με ερωτήματα πολυμέσων για να πείτε στο στοιχείο spanning να σταματήσει να επεκτείνεται.

Δείτε το παράδειγμα της στήλης-στυλό από το CSS-Tricks (@ css-tricks) στο CodePen.

Υποστήριξη προγράμματος περιήγησης

Ο Firefox δεν το υποστηρίζει column-span, αλλά υπάρχουν ενδιαφέρουσες λύσεις.

Εδώ είναι γενικά η υποστήριξη για διάταξη πολλαπλών στηλών:

Αυτά τα δεδομένα υποστήριξης του προγράμματος περιήγησης προέρχονται από την Caniuse, η οποία έχει περισσότερες λεπτομέρειες. Ένας αριθμός υποδεικνύει ότι το πρόγραμμα περιήγησης υποστηρίζει τη λειτουργία σε αυτήν την έκδοση και νεότερη.