Most elegant way to force a TEXTAREA element to line-wrap, *regardless* of whitespace

Question

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 wa

Answer 1

Breaking long words at textarea width size:

1) for modern browsers:

textarea { word-break: break-all; }

2) for IE8 compatibility add:

textarea { -ms-word-break: break-all; }

https://msdn.microsoft.com/en-us/library/ms531184%28v=vs.85%29.aspx

3) add IE11 compatibility hack:

Internet Explorer 11 word wrap is not working

@media all and (-ms-high-contrast:none) {
*::-ms-backdrop, textarea { white-space: pre; } 
}

---

This code it's working fine on:

-IE 11, Chrome 51, Firefox 46 (Windows 7);

-IE 8, Chrome 49, Firefox 18 (Windows Xp);

-Edge 12.10240 , Opera 30 (Windows 10);