martedì 1 dicembre 2009

Layout multicolonna con CSS3

Molte delle novità che le specifiche CSS 3 andranno a introdurre colmando alcune esigenze, che col passare del tempo si sono fatte sempre più presenti nello sviluppo e nella realizzazione di layout particolarmente articolati o complessi. Tra queste, vi è di sicuro il modulo dedicato alla disposizione del contenuto di un elemento su più colonne, come per esempio avviene nelle impaginazione dei quotidiani.

Impossibile da emulare in maniera efficace con gli strumenti messi a disposizione dalle specifiche attuali, la gestione di layout multicolonna viene affrontato dai CSS 3 mediante l'utilizzo di alcune proprietà, tra le quali column-count, column-width, column-gap e column-rule sono le più supportate da alcuni dei browser più recenti.

Tramite la proprietà column-width è così possibile definire la larghezza di ogni colonna; tramite column-count è invece possibile definire il numero di colonne in cui il contenuto verrà suddiviso; mediante invece le proprietà column-gap e column-rule è invece possibile organizzare rispettivamente lo spazio, che suddividerà ogni colonna adiacente, la forma e la dimensione di una eventuale riga da interporre tra le varie colonne.

Un articolo recentemente pubblicato sul blog Web Designer Notebook propone una rapida introduzione sui temi principali, riguardanti il modulo multi-column layout: l'autrice dell'articolo, Inayaili de León, dopo una breve introduzione espone un esempio delle impostazioni delle proprietà relative al modulo e del comportamento del contenuto dell'oggetto cui sono attribuite.

Nessun commento:

Posta un commento