My team have a legacy project where we use the X-UA-Compatible tag to garantee Internet Explorer render the page in Compatibility View Mode since we need to support IE7 and beyong.
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7"/>
It works in IE but the Page Inpector in Visual Studio 2013 render the page like it renders in IE with standard Document Mode instead.
We can only troubleshoot the problem with this compatibility in place since it does not occur in standard mode.
There is any configuration or hack to make Page Inspector renders the page in Compatibility Mode?
No there is no hack or configuration to make Page Inspector renders the page in compat mode.
I'm helping build a site for a client in Adobe CQ5. Due to the preferences of the client I cannot post the source, but we are having trouble with IE8.
When we try to view the site in IE8 the page will not render. When using the dev tools we can browse the HTML and the select tool does successfully highlight elements with the blue outline, but none of them render. The page is simply white. Things render properly in IE7 browser mode but not in IE8 or IE8 Compatibility Mode.
I've run the html through the W3 validator and nothing egregious jumped out. Anyone have any leads?
there must be some javascript error which causing this. otherwise CQ5 render well in ie8
If it works in IE7 but not IE8 you can try adding this to the <head> section
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
This forces IE7 emulation. You can also try playing with the doctype to see if this makes any difference.
The site renders fine for me in IE8 in Standards mode using a strict doctype. They have IE8 as well and I think it's rendering in Quirks mode for them.
Why would it render in Quirks mode for them and not anyone else? Could it be their Compatibility View Settings? I gave them instructions to uncheck "Display Intranet sites in Compatibility Mode” and “Display all websites in Compatibility Mode”.
If this doesn't work is there any other ideas?
IE defaults to Quirks mode when rendering a site on a local network, but standards when from localhost. Try adding a meta tag at the top of your head tag.
<meta http-equiv="X-UA-Compatible" content="IE=8" >
When you say that you "think it's rendering in quirks mode"-- why do you think that? If you hit F12 on the page, what do you see in the Developer Tools toolbar for the Document Mode?
"Display Intranet sites in Compatibility Mode" will show Standards Mode sites in IE7 Standards Mode (rather than IE8 or IE9 Standards), and Quirks mode sites will continue to render in Quirks mode.
I am developing new web site using MVC3 and jQuery, but while I was running, website always opens in IE8 or IE9 compatability view.
What do I have to do to open in standard mode?
Is there anything I can do these check in developer tools provided in IE?
Tell IE to use the latest rendering mode add a meta tag to your layout page
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
If your website is located under your IntraNet then it will always display in Compatability view by default (This is a default setting for IE 8 and IE 9). To change this:
Go to Tools | Compatability View Settings
Then uncheck the box that says "Display intranet sites in Compatibility View"
And Make sure "Display all websites in Compatibility View" is not checked.
Can someone please explain the difference between IE8 browser mode and document mode in simple terms?
What causes the browser mode to change?
What causes the document mode to change?
If a user changes the mode(s) via developer tools, does the change remain even if the page is refreshed?
I am asking this because we are doing some IE8 testing here, and different people have different combinations of the modes, and i want to try to figure out how this is happening.
From this article on the IE8 blog, entitled How IE8 Determines Document Mode
The Developer Tools settings override all Document Modes for pages displayed in a tab.
The X-UA-Compatible meta tag and then header override Compatibility View Settings and the doctype unless the X-UA-Compatible value is EmulateIE7 or EmulateIE8.
The user’s Compatibility View Settings override the Microsoft Compatibility View List.
If none of the above rules apply, the doctype determines whether the webpage renders in IE8 Standards, IE8 Almost Standards or Quirks Mode.
So from that we get the following answers to your questions:
Q. What is the difference between browser mode and document mode in simple terms?
A. Browser mode is set in the developer tools to emulate different IE browser version behaviors while document mode is defined on the web page to tell IE to render the site differently for compatibility purposes.
Q. What causes the browser mode to change?
A. The user changes the browser mode in the dev tools.
Q. What causes the document mode to change?
A. The Doctype and the X-UA-Compatible meta tag and header set by the web developer.
Q. If a user changes the mode(s) via developer tools, does the change remain even if the page is refreshed?
A. The Browser Mode will stay, but if you change the Doctype and X-UA-Compatible, they will go back to what is defined on the page.
UPDATE: As Adrien Be points out below, IE9+ adds the ability to change the document mode in the dev tools via a setting which will persist on refresh.
See your answer in this page.
The documentMode property returns the mode used by the browser to render the current document.
IE8 can render a page in different modes, depending on the !DOCTYPE or the presence of certain HTML elements.
This property returns one of following values:
5 - The page is displayed in IE5 mode
7 - The page is displayed in IE7 mode
8 - The page is displayed in IE8 mode
9 - The page is displayed in IE9 mode
Note: If no !DOCTYPE is specified, IE8 renders the page in IE5 mode!
Browser Mode: Specifies the user agent sent by the browser to the Web Server. Rendering differences can occur if your JavaScript or back-end code renders differently based on the user agent string. For example, you may see JavaScript that checks navigator.userAgent. (Mozilla/5.0 (compatible; MSIE 8.0...) This value is also used to to process conditional comments ([if lte IE 9], [if gt IE 8], etc.). The Emulation tooling in IE 11 does not have a browser mode. It has a user agent drop-down instead.
Document Mode: Specifies the rendering engine used to process the markup. This is typically where we see rendering issues and browser incompatibilities. The original goal (for better or worse) was website owners could choose a document mode for their site via a meta tag. In IE 11, the emulation tools are less confusing.
Testing:
If your goal is to emulate an old IE8 browser, you should change both browser mode and document mode. The emulation is not perfect, so a more thorough option is to download free test VMs from Microsoft where you can test with a *real" version of IE 8, 9, etc.
What causes these values to change?
The Browser mode will not change. (Unless you change it in Dev tools.) It is set before making the request to the web server.
The document mode can change based on web server response. It can be changed via a X-UA-Compatible HTTP response header, the doc type, meta tags, Intranet sites, markup issues, etc.
There is a little button in top left , in IE dev tools -> emulation (tab) that says "Persist emulation settings"
see this :
"Settings persistence and reset
A Persist Emulation settings icon is added to the Emulation tool. This will maintain your current emulation settings until specifically disabled, allowing you to work, close the browser, and come back with your emulation settings intact. To its right is a Reset Emulation settings icon, which quickly resets the tool back to default values."