We've got an application where users can enter "notes" into a rich edit control (Telerik's RedEditor, but that doesn't matter here). We had a user enter notes from w/in Safari that had a <span></span> in the middle of the note, and that span had a style on it specifying white-space:pre The HTML of the note was in the form of:
<div> This is a note <span class="Apple-tab-span" style="white-space: pre; "> </span> and here's more of the note. </div>
Simple enough, the style should apply to the span, and the span had 4 spaces in it. There should have been 4 spaces in the resulting output.
Here's the problem. IE seems to apply that white-space: pre; style not only to the span, but to the enclosing div! Therefore, this long line that should have wrapped since it's not in the span, now pushed the document out until the line fits on the page.
What am I missing. I know IE has problems, but this doesn't seem right, even for IE.
So, the question(s):
1) Am I correct that the white-space attribute should only have applied to the span?
2) Can this be resolved somehow? Remember, I'm not in control of the content being entered. And it's entered from a mac w/Safari and being viewed in IE.
Edit: The doctype on the page in question is:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">