Voir la source de Modèle:Colonnes/Documentation

{{Sous-page de documentation}}

== Utilisation ==

Ce modèle permet d'afficher du texte sur plusieurs colonnes (avec une marge de séparation par défaut d'1 [[Cadratin|''em'']] entre elles).

Ce modèle n'utilise plus que les propriétés [[feuilles de style en cascade|CSS]] normalisées (i.e. sans ''vendor prefixes''), celles-ci étant maintenant implémentées par tous les navigateurs, notamment :
* [[Mozilla Firefox]] <small>(moteur de rendu [[Gecko (moteur de rendu)|Gecko]])</small> : à partir de la version 52
* [[Google Chrome]] <small>(moteur de rendu [[Blink (moteur de rendu)|Blink]])</small> : à partir de la version 50
* [[Internet Explorer]] <small>(moteur de rendu [[Trident (moteur de rendu)|Trident]])</small> : à partir de la version 10
* [[Microsoft Edge]] <small>(moteurs de rendu [[EdgeHTML]] puis [[Blink (moteur de rendu)|Blink]])</small> : à partir de la version 12
* [[Safari (navigateur web)|Safari]] <small>(moteur de rendu [[WebKit]])</small> : à partir de la version 10
* [[Opera]] <small>(moteur de rendu [[Blink (moteur de rendu)|Blink]])</small> : à partir de la version 37

Pour plus d'informations sur le CSS concernant les colonnes, voir : [http://www.w3.org/TR/2001/WD-css3-multicol-20010118/ W3C, module CSS3-Multicol, www.w3.org], et [https://developer.mozilla.org/en/CSS/CSS3_Columns documentation développeurs Mozilla du rendu multicolonnes en CSS3].

'''Note :''' si le contenu à découper en colonnes contient des ''<nowiki>== Titres de section ==</nowiki>'', préférez l'usage de {{m|Début de colonnes}} et {{m|Fin de colonnes}} afin de ne pas faire supprimer les liens d'édition de section <small>(voir [{{fullurl:Liste de hors-la-loi dans le Far West|diff=93504482&oldid=90861718}} exemple])</small>.

== Syntaxe ==
Selon le réglage de la largeur des colonnes ou du nombre de colonnes :
* <code><nowiki>{{</nowiki>Colonnes|taille=''em''|1=''contenu''}}</code> (on donne une '''largeur minimale''' à chaque colonne {{incise|exprimée en {{page h'|em|''em''}} (ou [[cadratin]]s)|stop}}) ;
* <code><nowiki>{{</nowiki>Colonnes|nombre=''n''|1=''contenu''}}</code> (on '''impose le nombre''' de colonnes du tableau ; comme ce paramètre peut avoir un effet néfaste en matière de lisibilité sur les écrans qui ne sont pas suffisamment larges, son emploi en tant que paramètre isolé est déconseillé, voir l'alinéa suivant).

En combinant l'usage des deux paramètre <code><nowiki>taille=</nowiki></code> et <code><nowiki>nombre=</nowiki></code>, on donne une taille minimale à chaque colonne {{incise|exprimée en {{page h'|em|''em''}} (ou [[cadratin]]s)}} tout en fixant le '''nombre maximal''' de colonnes (il peut y en avoir moins mais ce nombre ne peut être dépassé) ; ainsi, on est assuré que le nombre de lignes par colonnes sera suffisant et ne déséquilibrera pas la présentation du tableau (en général, on souhaite que le nombre de lignes de chaque colonne soit au moins égal à trois) :
* <code><nowiki>{{</nowiki>colonnes|taille=''em''|nombre=''n''|1=''contenu''}}</code>.
Exemple à propos de la combinaison des deux paramètres : en prenant <code><nowiki>colonnes=9|taille=xx</nowiki></code>{{note|groupe=alpha|texte=Par exemple <code><nowiki>taille=16</nowiki></code>.}} pour un tableau qui a {{nobr|28 items}}, on garantit que {{incise|même pour un écran très large}} le nombre de colonnes ne pourra être supérieur {{nobr|à 9}}, donc que chaque colonne disposera au moins de « 28 <small>(items)</small> divisé par 9 <small>(colonnes)</small> » lignes, soit trois lignes <small>(en prenant la partie entière de « 28 divisé par 9 » qui vaut {{unité|3.11}})</small> par colonne.

Il est possible d'ajouter un paramètre style pour une plus grande personnalisation du contenu :
* <code><nowiki>{{</nowiki>Colonnes|taille=''em''|style=''CSS''|1=''contenu''}}</code>

{{Références|groupe=alpha}}


== Paramètres ==
<templatedata>
{
	"description": "Modèle affichant du texte sur plusieurs colonnes.",
	"params": {
		"1": {
			"label": "Contenu",
			"description": "Contenu affiché dans les colonnes",
			"type": "string",
			"required": true
		},
		"taille": {
			"description": "Largeur minimale d’une colonne, en cadratins",
			"example": "30",
			"type": "number",
			"suggested": true
		},
		"nombre": {
			"label": "Colonnes",
			"description": "Nombre maximum de colonnes (déconseillé si le paramètre « taille » n’est pas renseigné)",
			"type": "number"
		},
		"style": {
			"label": "Styles",
			"description": "Styles CSS supplémentaires",
			"type": "string"
		}
	},
	"paramOrder": [
		"taille",
		"nombre",
		"style",
		"1"
	]
}
</templatedata>

Les colonnes vont se créer automatiquement en fonction de la largeur maximale spécifiée, pour occuper toute la largeur du bloc contenant ce modèle. La largeur conseillée pour une liste de mots est 18 [[cadratin|em]], et il est dans ce cas plutôt déconseillé de restreindre le nombre de colonnes. Les détails du comportement peuvent être consultés dans les documents précédemment mentionnés.

{{Attention|dimension=16|Pour faciliter la lecture sur les écrans de taille réduite, il est recommandé de spécifier la taille plutôt que le nombre de colonnes.}}

== Exemple ==

<pre>{{Colonnes|taille=18|1=
# [[Algie vasculaire de la face]]
# [[Carl Neuberg]]
# [[Carrière militaire de Hugo Chávez]]
# [[Carte d'identité étudiante internationale]]
# [[Constitution argentine de 1853]]
# [[Dieu est mort (Friedrich Nietzsche)]]
# [[Dune]]
# [[E=mc2]]
# [[Écofascisme]]
# [[Egberto Gismonti]]
# [[Haute fréquence]]
# [[Jardin botanique de Buitenzorg]]
# [[Lancelot-Graal]]
# [[Lögsögumad]]
# [[Monica Frassoni]]
# [[O-Bon]]
# [[Particule α]]
# [[Parti pirate]]
# [[Quasar]]
# [[Science du Moyen Âge]]
# [[Self-Monitoring, Analysis and Reporting Technology]]
# [[Véhicule spatial]]
# [[Zircon]]
}}</pre>

{{Colonnes|taille=18|1=
# [[Algie vasculaire de la face]]
# [[Carl Neuberg]]
# [[Carrière militaire de Hugo Chávez]]
# [[Carte d'identité étudiante internationale]]
# [[Constitution argentine de 1853]]
# [[Dieu est mort (Friedrich Nietzsche)]]
# [[Dune]]
# [[E=mc2]]
# [[Écofascisme]]
# [[Egberto Gismonti]]
# [[Haute fréquence]]
# [[Jardin botanique de Buitenzorg]]
# [[Lancelot-Graal]]
# [[Lögsögumad]]
# [[Monica Frassoni]]
# [[O-Bon]]
# [[Particule α]]
# [[Parti pirate]]
# [[Quasar]]
# [[Science du Moyen Âge]]
# [[Self-Monitoring, Analysis and Reporting Technology]]
# [[Véhicule spatial]]
# [[Zircon]]
}}

== Voir aussi ==
=== Modèles connexes ===
* {{m|Bloc solidaire}}, pour éviter qu’un bloc (une liste, par exemple) se trouve séparé sur plusieurs colonnes
* {{m|Début de colonnes}}, {{m|Fin de colonnes}}, {{m|Début de bloc solidaire}} et {{m|Fin de bloc solidaire}}, qui permettent d'éviter les problèmes avec les caractères « | » et « = »

=== Catégories de maintenance ===
* [[:Catégorie:Modèle Colonnes avec un paramètre inconnu]]
* [[:Catégorie:Modèle Colonnes avec un paramètre "style" erroné]]

=== Liens externes ===
* [https://developer.mozilla.org/en-US/docs/Web/CSS/column-count <code>column-count</code>], [https://developer.mozilla.org/en-US/docs/Web/CSS/column-width <code>column-width</code>], [https://developer.mozilla.org/en-US/docs/Web/CSS/column-rule <code>column-rule</code>] et [https://developer.mozilla.org/en-US/docs/Web/CSS/column-gap <code>column-gap</code>] sur ''[[MDN Web Docs]]''

<includeonly>
[[Catégorie:Modèle colonne|Colonnes]]
[[Catégorie:Propriétés CSS préfixées comme fallback|Colonnes]]
</includeonly>