====== Afficher des colonnes dans l'administration ======

L'utilisation de colonnes permet d'ordonner les différents éléments des pages d'administration, comme dans les [[:2.0:usage:blog-parameters|Paramètres du blog]].

<note tip>Vérifiez que le contenu des colonnes ne se chevauche lorsque vous diminuez la résolution du navigateur, au minimum en 800×600 pixels.</note>

===== Deux colonnes =====

{{:2.0:resources:plugins:admin:columns:two-cols.png|}}

On utilise la classe ''two-cols'' :

<code html>
<div class="two-cols clear">
	<div class="col">
		Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec velit mi, in iaculis magna. Fusce nec tellus nec magna faucibus iaculis sed quis eros. Nulla sem orci, consectetur ullamcorper volutpat non, semper non purus.
	</div>
	<div class="col">
		Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec velit mi, in iaculis magna. Fusce nec tellus nec magna faucibus iaculis sed quis eros. Nulla sem orci, consectetur ullamcorper volutpat non, semper non purus.
	</div>
</div>
</code>


<note tip>La classe ''clear'' permet d'éviter que les blocs se chevauchent.</note>

===== Trois colonnes =====
{{:2.0:resources:plugins:admin:columns:three-cols.png|}}

On utilise la classe ''three-cols'' :

<code html>
<div class="three-cols clear">
	<div class="col">
		Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec velit mi, in iaculis magna. Fusce nec tellus nec magna faucibus iaculis sed quis eros. Nulla sem orci, consectetur ullamcorper volutpat non, semper non purus.
	</div>
	<div class="col">
		Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec velit mi, in iaculis magna. Fusce nec tellus nec magna faucibus iaculis sed quis eros. Nulla sem orci, consectetur ullamcorper volutpat non, semper non purus.
	</div>
	<div class="col">
		Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec velit mi, in iaculis magna. Fusce nec tellus nec magna faucibus iaculis sed quis eros. Nulla sem orci, consectetur ullamcorper volutpat non, semper non purus.
	</div>
</div>
</code>