Search code examples
internet-explorer-11

Internet Explorer 11 not displaying page correctly until DOM Tree Refresh


A site we've built (and tested successfully) for Chrome, Safari and Edge is acting up on Internet Explorer 11.

As expected the site looks like a piece by Picasso when first loaded (not in a good way) but the strange thing is that it seems to sort itself out when the DOM Tree is refreshed (F12->Refresh DOM Tree). It then reverts to being a mess when loaded in a new tab. In some cases a hard refresh (CTRL+F5) does work, but it's not reliable.

I'm struggling to see what's causing this and, by extension, the fact that it's not properly replicated makes it harder to fix.

I've also tried clearing IE11's cache and history but that doesn't seem to have done much. Is there any known flaw in IE11 that could be causing this?


Solution

  • As it turns out, a line in the site header was emulating IE7 when loading Internet Explorer. This one in particular:

    <meta http-equiv=\"X-UA-Compatible\" content=\"IE=EmulateIE7\" />
    

    I've now changed this to

    <meta http-equiv=\"X-UA-Compatible\" content=\"IE=Edge\" />
    

    which seems to work just fine in both Edge and IE11. Other browsers tested before have remained the same.

    I guess this was a slightly redundant issue but hope it could be of some use to someone else.

    Always peek at your site's code