I'm trying to highlight textarea words by putting a \[code\]div\[/code\] behind my field and copying over the values.\[code\]$("div").html($("textarea").text() .replace("bad-word", "<span style='background-color: red'>bad-word</span>"))\[/code\]I mocked it up and it works fine in Chrome. But in IE it seems that \[code\]span\[/code\]s won't jump to the next line of the \[code\]div\[/code\], when the word is too big to fit on that row. Instead it seems to force a break-word sort of effect - which the \[code\]textarea\[/code\] doesn't do, so the words don't align anymore. Tested in IE8 + 9.
Screenshot, code result in IE 9Here's a fiddle. try adding a letter at the start of the textarea and you'll see what I mean.