48 lines
1.2 KiB
Plaintext
48 lines
1.2 KiB
Plaintext
<page xmlns="http://projectmallard.org/1.0/"
|
|
type="topic" id="misc-grid" xml:lang="fr">
|
|
|
|
<info>
|
|
<revision docversion="0.1" date="2016-05-14" status="draft"/>
|
|
<credit type="author">
|
|
<name>Frédéric Péters</name>
|
|
<email>fpeters@entrouvert.com</email>
|
|
</credit>
|
|
|
|
</info>
|
|
|
|
<title>Système de grille CSS</title>
|
|
|
|
<p>
|
|
Un système de grille adaptive sur douze colonnes est proposé pour le
|
|
formatage des formulaires.
|
|
</p>
|
|
|
|
<figure>
|
|
<title>Système de grille</title>
|
|
<media type="image" mime="image/png" src="figures/grid.png"/>
|
|
</figure>
|
|
|
|
<p>
|
|
Chaque classe CSS pour un élément de la grille est décrit numériquement
|
|
par sa largeur. Par exemple, <code>grid-1-2</code> pour un élément
|
|
faisant la moitié de la largeur, <code>grid-2-3</code> pour un élément
|
|
en faisant les deux-tiers. Les dénominateurs possibles sont 2, 3, 4, 6
|
|
et 12.
|
|
</p>
|
|
|
|
<note><p>
|
|
Sur les petits écrans, les éléments de grille sont affichés sur toute la
|
|
largeur.
|
|
</p>
|
|
|
|
</note>
|
|
|
|
<p>
|
|
Pour forcer un retour en début de ligne, ou pour assurer un rendu correct
|
|
quand les éléments d'une ligne n'ont pas tous la même hauteur, une classe
|
|
supplémentaire, <code>newline</code> peut être posée sur le premier
|
|
élément de la nouvelle ligne.
|
|
</p>
|
|
|
|
</page>
|