HTML Textarea horizontal scroll

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+.

Solution 1:

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.

Solution 2:

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.