web-dev-qa-db-fra.com

Comment désactiver le wrapping Word en HTML?

Je me sens bête de ne pas être capable de comprendre cela, mais comment puis-je désactiver le Wordwrap? la propriété css Word-wrap peut être forcée avec break-Word, mais ne peut pas être forcée désactivée (elle ne peut être laissée seule qu'avec normal valeur).

Comment forcer Word Wrap off?

483
Alexander Bird

Vous devez utiliser l'attribut CSS white-space .

_white-space: nowrap_ et _white-space: pre_ sont les valeurs les plus couramment utilisées. Le premier semble être ce que vous recherchez.

803
Jon

Ajout de valeurs spécifiques au kit Web manquantes ci-dessus

white-space: -moz-pre-wrap; /* Firefox */
white-space: -o-pre-wrap; /* Opera */
white-space: pre-wrap; /* Chrome */
Word-wrap: break-Word; /* IE */
19
Matas Vaitkevicius

Je me demande pourquoi vous trouvez comme solution le "blanc-espace" avec "nowrap" ou "pre", ce n'est pas le comportement correct: vous forcez votre texte en une seule ligne! Le texte doit casser les lignes, mais pas les mots par défaut. Cela est dû à certains attributs CSS: Word-wrap, overflow-wrap, Word-break et des traits d'union. Donc vous pouvez avoir soit:

Word-break: break-all;
Word-wrap: break-Word;
overflow-wrap: break-Word;
-webkit-hyphens: auto;
-moz-hyphens: auto;
-ms-hyphens: auto;
hyphens: auto;

Donc, la solution est de les supprimer ou de les remplacer par "unset" ou "normal":

Word-break: unset;
Word-wrap: unset;
overflow-wrap: unset;
-webkit-hyphens: unset;
-moz-hyphens: unset;
-ms-hyphens: unset;
hyphens: unset;

UPDATE: Je fournis également des preuves avec JSfiddle: https://jsfiddle.net/azozp8rr/

1
zod