Une remarque ? Une suggestion ?...

Merci de participer à l'amélioration de ce site. Prenez le temps de rédiger votre remarque le plus précisément possible :

column-rule-width - Propriété CSS

column-rule-width

Résumé des caractéristiques de la propriété column-rule-width

Description rapide
Définit l'épaisseur du trait de séparation entre les colonnes.
Statut
Standard
Type de valeur
Dimension+ | Valeur prédéfinie
Valeurs prédéfinies
medium | thick | thin
Pourcentages
Ne s'appliquent pas.
Valeur initiale
medium
Héritée par défaut
Non
Type d'animation
Computed value : lors d'une animation, la propriété column-rule-width passe progressivement d'une valeur à une autre.
Module W3C
Module CSS - Mise en page multi-colonnes
Références (W3C)
Statut du document:: CR (document proposé pour la recommandation)

Description de la propriété column-rule-width.

column-rule-width définit l'épaisseur de la ligne de séparation entre les colonnes. Voyez aussi la column-rule-color column-rule.

Notez que l'épaisseur de la ligne de séparation est prise sur la largeur du gap : elle ne s'ajoute pas. La présence d'une ligne de séparation ne change donc pas la largeur des colonnes ni leur espacement.

Si l'épaisseur de la ligne de séparation est supérieure à la largeur du gap, la ligne empiète sur le contenu, mais sans le masquer, le contenu étant au dessus.

Pour des explications détaillées sur les possibilités du multicolonnage en CSS, reportez-vous à la propriété columns.

Syntaxes pour column-rule-width.

length est une valeur numérique, positive ou nulle, suivie d'une unité de dimension.

Syntaxe de column-rule-styleSchéma syntaxique de la propriété CSS column-rule-style (épaisseur de la ligne entre les colonnes). thin thin medium medium thick thick length lengthcolumn-rule-style:;column-rule-style:;
  • column-rule-width: medium;

    Valeur par défaut. Ligne d'épaisseur intermédiaire, de environ 4 pixels (celle valeur peut être différente d'un navigateur à l'autre).

  • column-rule-width: thin;

    Ligne de séparation fine (de l'ordre de 1 pixel).

  • column-rule-width: thick;

    Ligne de séparation épaisse (de l'ordre de 6 pixels).

  • column-rule-width: 3px;

    Un nombre positif ou égal à zéro, suivi d'une unité de dimension (voir les unités CSS de dimension).
    Les pourcentages ne sont pas acceptés.

  • column-rule-width: initial; column-rule-width: inherit; column-rule-width: revert; column-rule-width: revert-layer; column-rule-width: unset;

    La valeur initiale est : medium.

Simulateur.

column-rule-width :
En typographie, une colonne est un ou plusieurs blocs verticaux de contenu positionnés sur une page, séparés par des gouttières et/ou des règles (lignes de séparation). Les colonnes sont le plus souvent utilisées pour diviser de longs corps de texte qui ne peuvent pas tenir dans un seul bloc de texte sur une page.

Prise en charge par les navigateurs (compatibilité).

Les mises en page multi-colonnes sont partiellement prises en charge par les navigateurs récents (voir sur le tableau ci-dessous). Néanmoins, ces incompatibilités sont rarement gênantes, et la propriété column-rule-width est bien reconnue.

Colonne 1
Traitement général par les navigateurs des mises en page multi-colonnes.
Colonne 2
Compatibilité des navigateurs avec la syntaxe de la propriété CSS column-rule-width.
1
Columns
2
column-rule-width
Estimation de la prise en charge en pourcentage du parc actuel.
21%
95%

Navigateurs sur ordinateurs :

Navigateurs sur mobiles :

Navigateurs obsolètes ou marginaux :

Androïd Brower

Baidu Browser

Chrome

Chrome pour Androïd

Edge

Firefox

Firefox pour Androïd

Internet Explorer

KaiOS Browser

Opéra

Opéra Mobile

QQ Browser

Safari

Safari sur IOS

Samsung Internet

Oméra mini

Voir aussi, dans le même module de standardisation que column-rule-width.

Les spécifications CSS éditées par le W3C sont organisées en modules. column-rule-width fait partie du Module CSS - Mise en page multi-colonnes (CSS Multi-column Layout Module). Les définitions suivantes sont également décrites dans ce même module.

Propriétés.

Définit le nombre de colonnes, dans une mise en page sur plusieurs colonnes.
Gère la répartition du contenu entre les colonnes.
Définit tous les paramètres du trait de séparation entre les colonnes.
Définit la couleur des lignes de séparation de colonnes.
Choisit le type de trait pour la séparation des colonnes.
Gère le chevauchement du contenu sur plusieurs colonnes.
Définit la largeur des colonnes.
Définit les caractéristiques d'une mise en page sur plusieurs colonnes.