87

I would like to provide a horizontal scroll to a textarea in my HTML page. The scroll should appear without wrapping, if I type a long line without a line break. A few friends suggested using overflow-y CSS attribute, which did not work for me. The browsers that I use are IE 6+ and Mozilla 3+.

1
  • 2
    <textarea wrap="off"></textarea> Apr 8, 2018 at 7:45

5 Answers 5

107

I figured out to do it in a non-W3c-compliant way and it is working in both IE and Firefox and incidentally in Chrome too.

I added the attribute wrap with value off, that is <textarea cols=80 rows=12 wrap='off'> is what I have done.

1
  • The correct way to do this is via CSS as Aram Kocharyan's answer points out. off is not a valid or recognized value of the <textarea> attribute wrap.
    – Jesse
    Sep 4, 2016 at 17:36
56

To set no wrapping, you would use:

white-space: nowrap;

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

NOTE: However the depreciated wrap="off" seems to be the only way for legacy browser support. Though it isn't HTML 5 compliant, it's still my preference if you're targeting all browsers.

2
  • 14
    This doesn't work. It puts all text, including multiple lines, on the same line, not the desired behavior.
    – Mr. TA
    Jul 17, 2015 at 11:58
  • 35
    To see new lines properly, you must use white-space: pre;.
    – Jesse
    Sep 4, 2016 at 17:41
24

If you have pre-formatted text that includes LFs, you should add white-space: pre; to the css. That will preserve the new lines that are already in the text and will not wrap long lines.

This works in all versions of Firefox, all Webkit-based browsers, and IE6+.

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

5

Try these:

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

there should also be a -moz-scrollbars-horizontal

0

Use white-space: pre; as CSS property.

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

Your Answer

Reminder: Answers generated by Artificial Intelligence tools are not allowed on Stack Overflow. Learn more

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.