web-dev-qa-db-fra.com

HTML Textarea scroll horizontal

Je voudrais fournir un défilement horizontal vers une zone de texte dans ma page HTML. Le défilement doit apparaître sans encapsulation, si je tape une longue ligne sans saut de ligne. Quelques amis ont suggéré d'utiliser l'attribut CSS overflow-y, ce qui ne fonctionnait pas pour moi. Les navigateurs que j'utilise sont IE 6+ et Mozilla 3+.

htmltextareaword-wrap
70
Shyam

Pour ne définir aucun habillage, vous utiliseriez:

white-space: nowrap;

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

REMARQUE: Cependant, l'amortissement wrap="off" semble être le seul moyen de prendre en charge les anciens navigateurs. Bien qu'il ne soit pas conforme à HTML 5, c'est toujours ma préférence si vous ciblez tous les navigateurs.

41
Aram Kocharyan

J'ai pensé à 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 la valeur off, c'est-à-dire <textarea cols=80 rows=12 wrap='off'> c'est ce que j'ai fait.

93
Shyam

Si vous avez du texte pré-formaté qui comprend des LF, vous devez ajouter white-space: pre; au css. Cela préservera les nouvelles lignes qui sont déjà dans le texte et n'encapsulera pas les longues lignes.

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

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

11
Azdle

Essayez-les:

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

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

4
Filip Ekberg