white-space

par 4 contributeurs :

Résumé

La propriété CSS white-space est utilisée pour décrire comment sont gérés les espaces et les retours à la ligne à l'intérieur d'un élément, ainsi que la justification automatique.

Syntaxe

white-space:  normal | pre | nowrap | pre-wrap | pre-line | inherit

Valeurs

normal
Les suites d'espaces sont fusionnées. Les caractères de retour à la ligne dans la source sont considérés comme des espaces. Des ruptures de lignes seront automatiquement ajoutées pour les besoins de la justification.
nowrap
Fusionne les espaces comme normal, mais n'ajoute pas de rupture de ligne automatique (justification automatique).
pre
Les suites d'espaces sont préservées, et les ruptures de ligne ont lieu à la présence de caractères de retour à la ligne dans la source ou d'éléments <br>.
pre-wrap
Les suites d'espaces sont préservées. Les ruptures de lignes ont lieu, d'une part manuellement à la présence d'un caractère de retour à la ligne ou d'éléments <br>, et d'autre part automatiquement pour les besoins de la justification.
pre-line
Les suites d'espaces sont fusionnées. Les ruptures de lignes ont lieu, d'une part manuellement à la présence d'un caractère de retour à la ligne ou d'éléments <br> et d'autre part automatiquement pour les besoins de la justification.

Le tableau suivant résume le comportement des différentes valeurs de white-space :

  Nouvelles lignes Espaces et tabulations Justification (ruptures de ligne automatiques)
normal Fusionnés Fusionnés Automatique
pre Preservés Preservés Aucun
nowrap Fusionnés Fusionnés Aucun
pre-wrap Preservés Preservés Automatique
pre-line Preservés Fusionnés Automatique

Exemples

code { white-space: pre; }

Notes

white-space:pre-line is not implemented in Firefox prior to version 3.5 (Gecko 1.9.1).

Spécifications

Spécification État Commentaire
CSS 2.1 Recommendation  

Compatibilité des navigateurs

Browser Lowest version Support of
Internet Explorer 5.5 normal | nowrap
5.5 [*]
6.0 normal | pre | nowrap
8.0 normal | pre | nowrap | pre-wrap | pre-line
Firefox (Gecko) 1.0 (1.0) normal | pre | nowrap | -moz-pre-wrap
3.0 (1.9) normal | pre | nowrap | pre-wrap | -moz-pre-wrap
3.5 (1.9.1) normal | pre | nowrap | pre-wrap | pre-line
Opera 4.0 normal | pre | nowrap
8.0 normal | pre | nowrap | pre-wrap
9.5 normal | pre | nowrap | pre-wrap | pre-line
Safari (WebKit) 1.0 (85) normal | pre | nowrap
3.0 (522) normal | pre | nowrap | pre-wrap | pre-line

[*] Internet Explorer 5.5+ supporte word-wrap: break-word;
Le code suivant permet les sauts de ligne dans les éléments pre :

pre {
      word-wrap: break-word;      /* IE 5.5-7 */
      white-space: -moz-pre-wrap; /* Firefox 1.0-2.0 */
      white-space: pre-wrap;      /* navigateurs actuels */
}

Voir également

Text-related properties: letter-spacing, text-align, text-decoration, text-decoration-color, text-decoration-line, text-decoration-style, text-rendering, text-shadow, text-transform, text-indent, white-space, word-spacing

Étiquettes et contributeurs liés au document

Étiquettes : 
Contributeurs à cette page : teoli, claudepache, FredB, nonos
Dernière mise à jour par : teoli,
Masquer la barre latérale