IE8 display bug
Post categories
Founder & CTO
As a web developer, you regularly come across browser bugs, most often trying to work around obscure problems in IE6 and IE7. IE8 has generally been a relief in comparison, working pretty much to spec along with other browsers like Firefox, Opera, Safari and Chrome.
So I was surprised to come across a very odd and annoying bug in IE8 today. Basically a user reported that when trying to view a particular email, the page would just be blank. After being able to repeat the problem on the same email, I narrowed down bit by bit until I had a segment of HTML the replicated it, which came down to:
<!DOCTYPE html>
<html>
<body>
<SPAN dir=ltr>before
<SPAN dir=rtl><BR></SPAN>
after</SPAN>
</body>
</html>
Creating a file with just that contents and opening in IE8 displays completely blank.
If you make any of the following changes, the page will display ok (the “before” and “after” text displays):
- Remove the HTML5 doctype
- Add any whitespace character after the
tag - Remove the dir=ltr attribute from the first span
- Remove the dir=rtl attribute from the second span
Of course we don’t generate HTML like this, but people do receive HTML emails, that just happen to have content like this, and thus the whole page displays as blank! I’m currently working on a fix to work around this.