Propriété column-rule
La propriété column-rule définit une bordure
entre les colonnes dans un texte multicolonne.
Elle correspond, en termes de valeurs acceptées, à la propriété
border.
Exemple . Type solid
Dans cet exemple, le texte sera divisé en 3
colonnes avec des bordures entre les colonnes sous la forme
d'une ligne continue d'une épaisseur de 1px (la distance
entre les colonnes sera formée automatiquement,
puisque column-gap
est défini sur la valeur normal) :
<div id="elem">
some long text
</div>
#elem {
column-rule: 1px solid black;
column-count: 3;
column-gap: normal;
text-align: justify;
}
:
Exemple . Influence de column-gap
Dans cet exemple, le texte sera divisé en 3
colonnes avec un espace entre elles de 50px.
La bordure passera ainsi au milieu de l'espace
(il y aura 25px à droite et à gauche de la bordure) :
<div id="elem">
some long text
</div>
#elem {
column-rule: 1px solid black;
column-count: 3;
column-gap: 50px;
text-align: justify;
}
:
Voir aussi
-
la propriété
column-width,
qui définit la largeur d'une colonne -
la propriété
column-count,
qui définit le nombre de colonnes -
la propriété
column-gap,
qui définit l'espace entre les colonnes -
la propriété
column-span,
qui définit le nombre de colonnes sur lesquelles un élément doit s'étendre -
la propriété
columns,
qui est une propriété raccourcie pour le multicolonnage
