IE applies HTML normalization to the data that is assigned to the innerHTML property. This causes incorrect display of whitespace in elements that ought to preserve formatting, such as <pre> and <textarea>
Test page. Workaround is not included.
Reported by Sebastian Redl.
Explorer 5-6 Windows, Explorer 7 | Reported on 22 November 2004.
This site is no longer maintained. I’m sorry, but it’s just too much work for too little return. You can continue to browse old bug reports, though.
Search reports by browser:
2 Posted by HyperListBuilder on 27 November 2004 | Permalink
I know why I keep coming back. Thanks!
3 Posted by Phil Endecott on 26 March 2005 | Permalink
It also does this when you set a text node's .data property. The only way I've found to change the content of a PRE element and have line breaks in the right place is to use .innerHTML and put tags for newlines. Any other solutiions?
4 Posted by victor on 7 June 2005 | Permalink
I've found out that setting outerHTML doesn't trigger normalization. So I've decided to test for .outerHTML property and if not false (i.e., IE), prepend and append the opening and closing pre tags to the content I want to set and assign that to outerHTML.
5 Posted by Ates Goral on 7 September 2005 | Permalink
victor: Thanks a lot for the workaround! Saved my day (night actually).
Code excerpt:
// Workaround for IE <PRE> innerHTML normalization quirk
if (elem.tagName == "PRE" && "outerHTML" in elem)
{
elem.outerHTML = "<PRE>" + str + "</PRE>";
}
else
{
elem.innerHTML = str;
}
(Works with IE & FF)
6 Posted by LC on 5 March 2007 | Permalink
If you need a "cross-browser" solution, and don't need to display the data in question, use a text-area around the data. In IE, you traditionally get "\r\n" and in FF you get "\n".
Hope this helps.
7 Posted by Thomas Thomassen on 13 August 2007 | Permalink
I ran into this problem when I was writing a script to syntax colouring the code in codeblocks; .
What I ended up doing was using the DOM to extract the text from the element as the linebreaks is then intact.
1 Posted by Greg Reimer on 24 November 2004 | Permalink
Applies to list elements also. Specifically, IE removes closing LI tags and insists on adding a line break. Especially troublesome since the line break triggers IE's whitespace-in-CSS-lists bug.