Défilement horizontal d'un Textarea HTML

Question

Je voudrais faire défiler horizontalement une zone de texte dans ma page HTML. Le défilement doit apparaître sans être enveloppé, si je tape une longue ligne sans saut de ligne. Quelques amis m'ont suggéré d'utiliser l'attribut CSS overflow-y, qui n'a pas fonctionné pour moi. Les navigateurs que j'utilise sont IE 6+ et Mozilla 3+.

Answer 1

J'ai réussi à le faire d'une manière non conforme au W3c et cela fonctionne à la fois dans IE et Firefox et accessoirement dans Chrome aussi.

J'ai ajouté l'attribut wrap avec valeur off c'est-à-dire <textarea cols=80 rows=12 wrap='off'> c'est ce que j'ai fait.

Answer 2

Pour ne pas mettre d'emballage, vous devez utiliser :

white-space: nowrap;

Pour d'autres valeurs : https://developer.mozilla.org/en-US/docs/Web/CSS/white-space

REMARQUE : Toutefois, l'amortissement wrap="off" semble être la seule solution pour la prise en charge des anciens navigateurs. Bien qu'il ne soit pas conforme à HTML 5, c'est toujours ma préférence si vous visez tous les navigateurs.

Answer 3

Si vous avez du texte préformaté qui inclut des LF, vous devez ajouter white-space: pre; dans le css. Cela permettra de conserver les nouvelles lignes qui sont déjà dans le texte et de ne pas envelopper les longues lignes.

Cela fonctionne dans toutes les versions de Firefox, tous les navigateurs basés sur Webkit, et IE6+.

Source : https://developer.mozilla.org/en-US/docs/Web/CSS/white-space

Answer 4

Essayez ça :

overflow: scroll; 
overflow-y: scroll; 
overflow-x: scroll; 
overflow:-moz-scrollbars-vertical;

il devrait également y avoir un -moz-scrollbars-horizontal

Answer 5

Utilice white-space: pre; comme propriété CSS.

https://developer.mozilla.org/en-US/docs/Web/CSS/white-space