Suggerimento rapido il modulo CSS3 a più colonne

Per oltre sei anni, le colonne CSS3 ci sono state disponibili; tuttavia, stranamente, sono raramente utilizzati. Poiché attualmente sono supportati solo nei browser basati su Mozilla e Webkit, ciò significa che - di nuovo - nessun supporto in Internet Explorer. Ma è ok! Il mondo non finirà se gli utenti di IE vedranno un paragrafo più lungo. Ti mostrerò come utilizzare questo utile modulo nel suggerimento rapido del video di oggi.


Iscriviti alla nostra pagina YouTube per guardare tutti i tutorial video!

Preferisci guardare questo video su Screenr?

 #container p -webkit-column-count: 3; -webkit-column-gap: 10px; -moz-column-count: 3; -moz-column-gap: 10px; numero di colonne: 3; column-gap: 10px; 

  • column-count: Il numero desiderato di colonne per l'elemento.
  • column-gap: Il padding tra ogni colonna.
  • column-rule: Il divisore per ogni colonna; può essere usato per specificare un bordo.
  • larghezza della colonna: Utilizzato per specificare in modo specifico la larghezza di ogni colonna.

Si prega di notare che dobbiamo prefisso ciascuna proprietà con -webkit o -moz, di conseguenza; quindi: -webkit-column-count.

Usi le colonne CSS nei tuoi progetti? Se no, perché no?