Template:Div col

Revision as of 04:13, 6 January 2021 by Rrdubbudu (talk | contribs) (Text replacement - "Template di layout" to "Visual enhancement templates")
Go to top


Questo template serve per impaginare delle liste in colonne. Il numero effettivo di colonne dipende dalla larghezza dello schermo.

Uso

Parametri

cols=
Specifica colonne normali (default) o più strette (inserendo "strette" o "3"). La larghezza standard delle colonne è stabilita dalle classi colonne e colonne_strette definite in MediaWiki:Common.css.
Al posto di cols si può usare anche il primo parametro anonimo, es. {{Div col|strette}}.
dim=
Alternativo a cols, specifica manualmente la larghezza delle colonne (es. 200px o 15em).

Esempi

{{Div col}}
* a
* b
* c
* d
* e
{{Div col end}}
Produce
  • a
  • b
  • c
  • d
  • e




{{Div col|cols=strette}}
* a
* b
* c
* d
* e
* f
{{Div col end}}
Produce
  • a
  • b
  • c
  • d
  • e
  • f




{{Div col|dim=100px}}
* a
* b
* c
* d
* e
* f
{{Div col end}}
Produce
  • a
  • b
  • c
  • d
  • e
  • f

Personalizzazione

Gli utenti registrati, nel proprio foglio di stile, possono cambiare la larghezza di default delle colonne inserendo questi codici con un numero di "em" diverso:

.colonne {
 -moz-column-width:30em;
 -webkit-column-width:30em;
 column-width:30em;
}
.colonne_strette {
 -moz-column-width:20em;
 -webkit-column-width:20em;
 column-width:20em;
}

Template correlati

Template Vantaggi Svantaggi
{{colonne}}
  • Permette di decidere il punto esatto in cui inizia la colonna successiva;
  • dà un aspetto omogeneo anche con i browser più vecchi;
  • permette di utilizzare anche solo parzialmente la larghezza dello schermo;
  • permette di compattare automaticamente le colonne, che assumono la larghezza minima necessaria, anche diversa tra di loro.
  • Utilizza le tabelle;
  • occorre ricalibrare manualmente le colonne quando si aggiungono o rimuovono elementi in una lista;
  • occorre fare qualche magia - <ol start="numero ultimo elemento colonna precedente + 1"> - per gestire gli elenchi numerati;
  • ha problemi di sovrapposizione quando ci sono immagini o sinottici a destra.
{{div col}}
  • Il numero di colonne è automatico e si adatta alla larghezza dello schermo;
  • utilizza i CSS e non le tabelle;
  • funziona correttamente con i browser basati su WebKit (Safari, Google Chrome, …), Gecko (Mozilla Firefox, …), Presto (motore di rendering) (Opera) e Trident (solamente a partire da Internet Explorer 10);
  • nei browser che non lo supportano le colonne sono ignorate, ma non è compromessa la leggibilità;
  • non ha problemi di sovrapposizione con le immagini flottanti;
  • il contenuto si ridispone automaticamente quando si aggiungono nuovi elementi;
  • non ha problemi né con gli elenchi puntati né con quelli numerati;
  • gli utenti possono personalizzare la larghezza standard delle colonne.
  • Utilizza attributi CSS non ancora ratificati;
  • non funziona con le versioni di Internet Explorer (basato su Trident) precedenti alla 10;
  • non è possibile spezzare una colonna a piacimento.