I have come across a website that needs to be compatible with IE 11. While inspecting its source I have notice following meta tag;
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" />
And checked that its document mode is also 8. In these settings It has a lots of issues. When I updated it to latest i.e. Edge, things become fine again.
Therefore, I have updated the meta tag to;
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
But I just want to know is this safer to update the meta tag I don't know what was there reason of adding IE=EmulateIE8. Or I need to add a some condition for specifically IE11?
Related
In our application we are using <meta http-equiv="X-UA-Compatible" content="IE=Edge" /> as the first line of code inside <head>tag. In Local and QA it is working fine, but when we try to open PROD in IE we are facing some problem - it is opening in document mode 7. In IE EDGE it is working fine, we are facing this issue in IE 11.
What might be the problem?
If:
The production environment is in the Intranet zone (right-click and then choose Properties), and
The page does not contain a <!DOCTYPE> directive, and
The Default settings have not been changed
(Other factors may also be involved.)
Then, the page is likely loading in IE7 Compatibility mode by design.
If you cannot change the page to include the HTML5 doctype directive (<!DOCTYPE html>), then you might see if the web server can serve the x-ua-compatible header with the page.
I was researching about meta tags in HTML and I ended up on a website that suggested that I don't set the name and htt-equiv attribute at the same time. I read somewhere that if I need to support IE8 OR IE9 then it's recommended to use the http-equiv attribute with X-UA Compatible value. My website needs to be supported by older versions of IE so i use the following line of code:
<meta http-equiv="X-UA-Compatible" content="IE=edge">
But at the same time, i also want to provide extra information such as description of my webpage and also specify keywords. Those are set by using the name attributes. Like this:
<meta name="description" content="">
<meta name="author" content="">
<meta name="keywords" content="">
But according to several webpages, I cannot use the http-equiv and name attributes at the same time. So how do I ensure compatibility with older versions of IE and extra information about the webpage at the same time?
I'm quite confused, please enlighten me.
I have the following html code that works without the http-equiv="X-UA-Compatible" in IE8 but fails when it has it. I think the order is correct (http://blogs.msdn.com/b/ieinternals/archive/2011/07/18/optimal-html-head-ordering-to-avoid-parser-restarts-redownloads-and-improve-performance.aspx), and the code is valid so I don't see the reason why it would do this.
Please, any explanation?
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=8, IE=edge" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<base href="file:///D:/LocalPath/ToFrameElements/">
<title>IE8 stuff</title>
</head>
Your X-UA-Compatible http-equiv string is invalid.
It has 2 values:
IE=8 ( IE 8 standards rendering mode )
IE=edge ( latest engine )
However, the syntax is incorrect. The correct syntax is:
<meta http-equiv="X-UA-Compatible" content="IE=8; IE=edge" />
When multiple values are specified, highest value will be used. That is,
In IE9 , the page will be rendered in IE 9 standards rendering mode.
In IE8 , the page will be rendered in IE 8 standards rendering mode.
Solution: Fix the syntax and retry.
Reference:
https://developer.mozilla.org/en-US/docs/Persona/Browser_compatibility
Define Document Compatibility
Understanding Compatibility Modes in IE8
Sidenote: IE supports this meta tag starting from IE 8.
The base element is defined so that its value must be an absolute URL. Besides, any effect of a file: URL is by definition system-dependent. So you should organize your local files and references to them so that a base tag is not needed.
The frames wouldn't appear because of the standard document mode that the
<meta http-equiv="X-UA-Compatible" content="IE=8, IE=edge" />
or not relaying on the browser's error tolerance, the syntactically correct way
<meta http-equiv="X-UA-Compatible" content="IE=8; IE=edge" />
implies.
This is because in the standard document rendering mode IE does not allow the use of base href with links to the filesystem for security's sake. To have the base href working it can only be achieved by removing the the meta http-equiv="X-UA-Compatible" so that page will run in quirks rendering mode.
<meta http-equiv="X-UA-Compatible" content="IE=9; IE=8; IE=7; IE=EDGE" />
Actually what is the meaning of this statement ?
Some of the examples use , to separate versions of IE, while some use ;; which is correct?
The order IE=9; IE=8; IE=7; IE=EDGE has some importance, I wish to know that.
Edit: I am using <!DOCTYPE html>
If you support IE, for versions of Internet Explorer 8 and above, this:
<meta http-equiv="X-UA-Compatible" content="IE=9; IE=8; IE=7" />
Forces the browser to render as that particular version's standards. It is not supported for IE7 and below.
If you separate with semi-colon, it sets compatibility levels for different versions. For example:
<meta http-equiv="X-UA-Compatible" content="IE=7; IE=9" />
Renders IE7 and IE8 as IE7, but IE9 as IE9. It allows for different levels of backwards compatibility. In real life, though, you should only chose one of the options:
<meta http-equiv="X-UA-Compatible" content="IE=8" />
This allows for much easier testing and maintenance. Although generally the more useful version of this is using Emulate:
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" />
For this:
<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
It forces the browser the render at whatever the most recent version's standards are.
For more information, there is plenty to read about on MSDN,
In certain cases, it might be necessary to restrict the display of a webpage to a document mode supported by an earlier version of Internet Explorer. You can do this by serving the page with an x-ua-compatible header. For more info, see Specifying legacy document modes.
- https://msdn.microsoft.com/library/cc288325
Thus this tag is used to future proof the webpage, such that the older / compatible engine is used to render it the same way as intended by the creator.
Make sure that you have checked it to work properly with the IE version you specify.
How can I tell if I should include this meta tag in my site?
<meta http-equiv="X-UA-Compatible" content="IE=edge">
By testing it in various versions of IE (and, as a rule of thumb, if there are problems, fix the problems rather then telling IE to emulate an older version of itself).