Html Textarea elements only wrap when they reach a space or tab character. This is fine, until the user types a looooooooooooooooooooooong enough word. I'm looking for a way to strictly enforce line breaks (eg.: even if it results in "loooooooooooo \n ooooooooooong").
The best I've found is to add a zero-width unicode space after every letter, but this breaks copy and paste operations. Anyone know of a better way?
Note: I'm referring to the "textarea" element here (i.e.: the one that behaves similarly to a text input) - not just a plain old block of text.
Source: Tips4all
The CSS settings word-wrap:break-word and text-wrap:unrestricted appear to be CSS 3 features. Good luck finding a way to do this on current implementations.
ReplyDeletequirksmode.org has an overview of various methods.
ReplyDeleteThere's a related SO question: "In HTML, how to word-break on a dash?"
In browsers that support it, word-wrap: break-word might give the desired effect as well.
There's the non-standard element wbr that is supported by at least
ReplyDeleteFirefox, http://developer.mozilla.org/En/HTML/Element
Internet Explorer, http://msdn.microsoft.com/en-us/library/ms535917(VS.85).aspx
and Opera.
I tested the <wbr>, ​ and ­ techniques. All three worked well in IE 7, Firefox 3 and Chrome.
ReplyDeleteThe only one that did not break the copy/paste was the <wbr> tag.
According to my tests, only Firefox has the described behavior among current browsers. So I guess your best bet is to wait for the imminent release of Firefox 3.1 to solve your problem :)
ReplyDelete