Internet Explorer browser version specific document mode - html

I want my application to be opened in
document mode IE-8 for an IE-8 version browser and
document mode IE-9 for an IE-9 version browser.
Otherwise the application will fail to open some tabs.
The <meta> tag to force the browser to open in a particular document mode is like this
<meta http-equiv="X-UA-Compatible" content="IE=9">
If we dont use a <meta> tag, sometimes the browser is opening our application in a different document mode.
I am using html concept.
Please tell me how we can change the document mode properly according to the browser version.

Try IE=Edge
<meta http-equiv="X-UA-Compatible" content="IE=edge">

<!--[if IE 8]>
<meta http-equiv="X-UA-Compatible" content="IE=8"> or do whatever you want
<![endif]-->
<!--[if IE 9]>
<meta http-equiv="X-UA-Compatible" content="IE=9"> or do whatever you want
<![endif]-->

Related

Make "IE9 Compatibility View" mode default when IE9 renders a site

I have developed a web site on Google App Engine using JSP and JQuery 1.11.2. The following tag is added to the Head section on every jsp.
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
The client has to be using IE9 to view this site. Also, the javascript code only works with "IE9 Compatibility View".
The issue is every time the user opens the home page IE9 renders it in "Internet Explorer 9" mode instead of ""IE9 Compatibility View"".
How can I set up the meta tag in head to force IE9 to use "IE9 Compatibility View" as Browser Mode and keep "IE9 Standards" as Document Mode?
For force IE9 to use "IE9 Compatibility View", like this:
<meta http-equiv="X-UA-Compatible" content="IE=9">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
or use X-UA-Compatible in the HTTP header.
Use this as a first meta tag in page,
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

Enforcing compatible mode for IE

Executing my below code in IE browser and found look& feel issue in rendering the content based on the included font-awesome-ie7.min.css. Tried this code in IE8 browser mode with document mode (IE8 &IE7 standards)
<meta name="description" content="">
<meta name="author" content="">
<link rel="shortcut icon" href="../assets/img/favicon.ico">
<meta http-equiv="X-UA-Compatible" content="IE=8">
<!--[if IE 7]>
<link rel="stylesheet" href="../assets/css/font-awesome-ie7.min.css">
<![endif]-->
Not rendering properly.
Looks like you have included a stylesheet for IE7 and trying to view output on IE8 while css will not work on this. To get output on IE8 you should try writing like this...
<!--[if IE 8]>
<![endif]-->
Hope this helps!
You need to tell us what version of IE you're using to test. IE 11 dropped support for conditional comments so it won't matter what you have as a conditional in there.
I would use lte (less than or equal to) IE 8 if you want to load for 7 as well.
You should load the regular font awesome css asset before the conditional statement. Load order is important.

Page keeps entering Quirks mode on IE8 even with DOCTYPE set

I'm trying to load my site in IE8 and it keeps reverting back to Quirks Mode and displays the page all funny. I can switch it to IE8 document mode via developer tools and it's fine, but doesn't answer why it keeps reverting to Quirks Mode by itself.
I have set <!DOCTYPE html> so it shouldn't be doing it. The top of the page includes this, as generated by the CMS:
(ignore this line, it's here to show the blank lines in the source code)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!--[if IE 7]> <html class="ie7 no-js" lang="en"> <![endif]-->
<!--[if lte IE 8]> <html class="ie8 no-js" lang="en"> <![endif]-->
<!--[if (gte IE 9)|!(IE)]><!--> <html class="not-ie no-js" lang="en"> <!--<![endif]-->
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
Any ideas? Thanks!
According to the w3c validator you have whitespace before your doctype. That would be enough to throw IE into quirks mode.
Non-space characters found without seeing a doctype first. Expected .
See this for a possible solution
I believe IE defaults to Quirks unless you force it to use standards. I use this to force standards in IE...
<!DOCTYPE html>
The doctype must be exactly as above to force standards to work (so far so good).
<html>
<head>
The next lines must be the first in the head tag, or they are ignored.
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta http-equiv="X-UA-Compatible" content="IE=9" />
<meta http-equiv="X-UA-Compatible" content="IE=8" />
The first line forces standards for IE versions that understand "edge" - no matter what version, any version above 9 should understand this line to be instructing it to display standards.
Since IE9 does not understand "edge", the second line forces IE9 to display in standards.
Since IE8 does not understand content="IE=9", it skips this and moves on to the next line, which it does understand, and which forces it to display in standards.
I tested all of these with spaces and hard returns above the doctype and they worked fine even with spaces and returns.
I think you can place another statement below the IE8 statement for IE7, but I don't want to swear to this.

meta http-equiv X-UA-Compatible

<meta http-equiv="X-UA-Compatible" content="IE=9" >
the above line of code forces the browser to make
Document mode to IE 9 standard and
Browser mode to IE 9 Compatiblity mode
How can i make Document mode to IE 9 standard and browser mode to IE 9 mode
this works for me..
<!DOCTYPE html>
<html>
<head>
<title>title</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
Do you have any other links or scripts above your X-UA-Compatible meta tag in your <head>? If so this might be causing the problem.
Also make sure to check the compatibility settings in your browser itself by going to:
Tools --> Compatability View Settings
There are several possible explanations, such as HTTP headers overriding the meta tag, domain name being blacklisted by Microsoft, or your local admin having forced IE to Compatibility mode. For a description of some possibilities and possible cures, check out IE8 and IE9 Complications in “Activating Browser Modes with Doctype”.

IE Compatibility mode cannot be disabled with Apache vhost config

I am having a big issue trying to disable IE's Compatibility mode.
After much head banging, I have traced the issue down to whether the site is been served as Apache's default config, or as a virtual host.
I know this to be the case as when I access the site with the 'localhost' domain, everything is fine. As soon as I access the very same page via a domain configured in a virtual host - the site renders in Compatibility mode.
Can anyone please shed any light on this crazy issue???
Serving the site as the default host isn't an option.
Dean
Ah-ha!
From here (emphasis mine):
A large number of line-of-business websites are Internet Explorer 7 capable today. In order to preserve compatibility, Internet Explorer 8 ships with smart defaults based on zone evaluation. In the default state, all sites on the public internet display in Internet Explorer 8 Standards mode (Compatibility View off) and all intranet websites display in Internet Explorer 7 Standards mode (Compatibility View on).
...
If you navigate to sites on your local intranet like http://myPortal and http://sharepoint/sites/mySite, Internet Explorer 8 identifies itself with a User Agent string of ‘7’, Version Vector of ‘7’, and displays webpages that trigger standards mode in Internet Explorer 7 Standards mode. This combination allows webpages that worked correctly in Internet Explorer 7 to continue to do so in IE8.
I'm not commenting this. I'm sure this has some good real-world reasons, but I still have the urge to hit my head on the desk.
When a web-site is being served on the local intranet, Internet Explorer will (by default) switch to IE7 compatible mode.
You can use the to disable this "IE7 on the intranet compatibility mode" by including the X-UA-Compatible response header to your page:
HTTP/1.1 200 OK
X-UA-Compatible: IE=8
You can also add the equivlent of an http response head to your page by including a meta http-equiv element to the HEAD> of your document. E.g.:
<!DOCTYPE html>
<html>
<head>
<title>Hello world!</title>
<meta http-equiv="X-UA-Compatible" content="IE=9">
</head>
<body>
</body>
</html>
Note: If you do include the header
| Header | Value |
|------------------|---------|
| X-UA-Compatible | IE=10 |
to your html document, you must add it high enough in the HEAD before something else happens that locks in the document mode - and you're locked into IE7.
Wrong example 1
<!DOCTYPE html>
<meta http-equiv="X-UA-Compatible" content="IE=8">
<html lang="en">
<head>
meta elements belong inside the head element
Wrong example 2
<!DOCTYPE html>
<html lang="en">
<head>
<title>Hello, world!</title>
<link rel="stylesheet" type="text/css" media="all" href="main-73c2257f2d.css" />
<meta http-equiv="X-UA-Compatible" content="IE=8">
The X-UA-Compatible element must appear first in the head; except for title and other meta elements.
The X-UA-Compatible header isn't case sensitive; however, it must appear in the header of the webpage (the HEAD section) before all other elements except for the title element and other meta elements.
Wrong example 3
<!doctype html>
<!--[if lt IE 7]> <html class="no-js ie6 oldie" lang="en"> <![endif]-->
<!--[if IE 7]> <html class="no-js ie7 oldie" lang="en"> <![endif]-->
<!--[if IE 8]> <html class="no-js ie8 oldie" lang="en"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
<head>
<meta http-equiv="X-UA-Compatible" content="IE=10">
The conditionals lock the browser into IE7 mode. Remove them.
Correct
<!doctype html>
<head>
<title>Hello, world!</title>
<meta http-equiv="X-UA-Compatible" content="IE=10">