How can I force Internet Explorer 9 to use standards document mode? I built a website and I'm finding that IE9 uses quirks mode to render the website pages. But I want to use standards mode for rendering.
<!doctype html>
<meta http-equiv="X-UA-Compatible" content="IE=Edge">
This makes each version of IE use its standard mode, so IE 9 will use IE 9 standards mode. (If instead you wanted newer versions of IE to also specifically use IE 9 standards mode, you would replace Edge by 9. But it is difficult to see why you would want that.)
For explanations, see http://hsivonen.iki.fi/doctype/#ie8 (it looks rather messy, but that’s because IE is messy in its behaviors).
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
The meta tag must be the first tag after the head tag or it will not work.
There is something very important about this thread that has been touched on but not fully explained. The HTML approach (adding a meta tag in the head) only works consistently on raw HTML or very basic server pages. My site is a very complex server-driven site with master pages, themeing and a lot of third party controls, etc. What I found was that some of these controls were programmatically adding their own tags to the final HTML which were being pushed to the browser at the beginning of the head tag. This effectively rendered the HTML meta tags useless.
Well, if you can't beat them, join them. The only solution that worked for me is to do exactly the same thing in the pre-render event of my master pages as such:
Private Sub Page_PreRender(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.PreRender
Dim MetaTag As HtmlMeta = New HtmlMeta()
MetaTag.Attributes("http-equiv") = "Content-Type"
MetaTag.Attributes("content") = "text/html; charset=utf-8;"
Page.Header.Controls.AddAt(0, MetaTag)
MetaTag = New HtmlMeta()
MetaTag.Attributes("http-equiv") = "X-UA-Compatible"
MetaTag.Attributes("content") = "IE=9,chrome=1"
Page.Header.Controls.AddAt(0, MetaTag)
End Sub
This is VB.NET but the same approach would work for any server-side technology. As long as you make sure it's the last thing that gets done right before the page is rendered.
put a doctype as the first line of your html document
<!DOCTYPE html>
you can find detailed explanation about internet explorer document compatibility here: Defining Document Compatibility
To prevent quirks mode, define a 'doctype' like :
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
To make IE render the page in IE9 document mode :
<meta http-equiv="x-ua-compatible" content="IE=9">
Please note that "IE=edge" will make IE render the page with the most recent document mode, rather than IE9 document mode.
Make sure you take into account that adding this tag,
<meta http-equiv="X-UA-Compatible" content="IE=Edge">
may only allow compatibility with the latest versions. It all depends on your libraries
I tried with an alternate method:
Hit F12 key
Then, at right hand side in the drop down menu, select internet explorer version 9.
That's it and it worked for me.
Make sure you use the right doctype.
eg.
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
or just
<!doctype html>
and also read and understand how compatibility modes and developer toolbar for IE work and set modes for IE:
I have faced issue like my main page index.jsp contains the below line but eventhough rendering was not proper in IE. Found the issue and I have added the code in all the files which I included in index.jsp. Hurray! it worked.
So You need to add below code in all the files which you include into the page otherwise it wont work.
<!doctype html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=Edge">
</head>
Related
I have this html/jsp page:
<%#page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML>
<html ...
</html>
which, for some reason, is opened by default in compatibility mode on IE (in my case version 10) and this messes up everything as it just does not understand some modern constructs present in libraries such as angularjs.
By opening developer's tools and changing the view mode to "standard IE" everything fixes up and my web application works fine.
So, what's wrong with this header? Is there a way to force IE to open my page in normal mode?
This question is more or less the same of this one, I know that:
Why Does IE-8 push the view to Compact/Compatibility view?
but I don't want to force my user to open tools and set options like correct marked answer suggests: most of them are just ignorant, many of them have developers tools disabled on their company's PC.
In the end just want to see where's the problem with my web application and make so that IE accepts it as a normal page.
insert meta tag in header HTML:
<meta http-equiv="X-UA-Compatible" content="IE=Edge"/>
The "edge" forces standards mode (or latest rendering engine) in IE.
To force IE8 to standard mode.
<meta http-equiv="x-ua-compatible" content="IE=8">
I'm attempting to embed a "new" style page inside of an older page via iframe, but in IE9, things like border-radius are still having no effect when the page is loaded inside the iframe. When the page is loaded on its own, the rounded corners and effects appear just fine, but when inside the iframe, the css properties seem to be ignored.
Initially I thought this was DOCTYPE inheritance issues, but they're both <!DOCTYPE html> (outer and inner page). Next, I belive it's the content="IE=Emulate8" that's being inherited by the inner iframe. This is, of course, a theory. If it's an incorrect theory, please let me know. :)
Anyway, here's an example of the page:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta content="IE=EmulateIE8" http-equiv="X-UA-Compatible">
</head>
<body>
... stuff...
<iframe>
<!DOCTYPE html>
<html lang="en">
<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">
</head>
</html>
</iframe>
</body>
</html>
Some of this may not really be relevant. Anyway, my question is: if the EmulateIE8 is the culprit as to why css properties like border-radius aren't working in the iframe under IE9, is it possible to override it or disable it inside the inner iframe?
Just to note: changing what's outside the iframe is difficult without changing the entire framework of the application, unfortunately (legacy apps *sigh*). I'm attempting to put something a little more modern inside of the legacy application.
As noted here:
As of IE9 mode, webpages cannot display multiple document modes. For example, consider a standards-based webpage that contains a frame element that displays content in quirks mode. IE9 mode displays the child frame in standards mode (because the parent document is in standards mode). Starting with Internet Explorer 10, however, child frames can emulate quirks mode. For more info, see IEBlog: HTML5 Quirks mode in IE10. For best results, however, use document modes consistently.
I'm working on a WordPress site and even when I delcare html5 as the docmode, the site still forces to open in quirks in IE9 and 8. The url is: http://teknikor.bethmotta.com
my header.php contains the following code:
<!doctype html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
Any ideas on why this is still opening in Quirks? Thanks for any help!
I just viewed the site and you've got about 38 lines of HTML above your doctype, which looks to be related to Google Analytics. IE's going to want the doctype to be the first line of source, I believe.
I am building a webpage, and I found a problem which I cannot solve. If I declare the DOCTYPE, the page breaks completely, and if I don't declare it, the IE version won't work properly (the drop down menus won't drop). But, despite of it's broken, if I declare the DOCTYPE, the dropdown menus work at every explorer, including IE. So I really don't know what to do, any idea? I'm currently declaring the DOCTYPE as: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> but I've tried other options and they don't work neither.
Last time I posted here the free server blocked the page (probably too many users, as I'm the only one getting in currently), but these are 2 examples of the page:
with DOCTYPE: http://newfutureuniversity.org/project/
without DOCTYPE (dropdown menus not working with IE9):
http://newfutureuniversity.org/learn/
Any help would be appreciated. Even if it's just to orientate me about where to start searching, as I could't find anything similar.
Using or not using the doctype for modern web pages is no longer optional and is required. It is the very first thing that goes down on a page and never changes. If you created a page without one to begin with, then your whole page is set in quirks mode. Trying to fix it or change it by adding/removing the doctype is, essentially, changing the rules and the target as you go along.
Trying to use jQuery to fix this now is just sinking you into a deeper hole. Add the doctype, use a modern browser to get everything how you want it (IE is not a modern browser), then work on getting IE to follow along.
The charset you should be using is <meta charset="utf-8">
for HTML5 it is nice and small, you have an XHTML declaration
it can simply be:
<!DOCTYPE html>
for HTML 5
Using XHTML tells the parser to be much more strict in what it accepts. you have no <html> root in your document (HTML5 won't care about this).
content type specification is different in HTML5 as well
instead of <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /> you can use <meta charset="iso-8859-1" /> if that is your desired character set.
A web application we have for an organisation that is officially upgrading its standard browser from IE6 to IE8 (queue celebrations), we've set all our DOCTYPEs to be <!DOCTYPE html> (as well as fixed other html code) and I thought that in IE8 this would cause the page to be rendered in IE8 Standards Mode. However, it is still shown in IE7 Standards mode.
I've added the <meta http-equiv="X-UA-Compatible" content="IE=8"> into the <head> section and it still fails to default to IE8 Standards mode. I'm presuming at this stage that there must be a setting (perhaps Group Policy etc) that is forcing the mode.
After reading a hack on an MSDN forum that if you put the meta tag before the <html> tag, it correctly displays as IE8 Standards mode, and this worked for me. Is there another way to do this? It just looks terrible seeing the meta tag there...
Here's roughly how each page is made up:
<!DOCTYPE html>
<meta http-equiv="X-UA-Compatible" content="IE=8">
<html lang="en">
<head>
<meta charset="utf-8">
<title>Page Title</title>
</head>
<body>
</body>
</html>
You could set X-UA-Compatible as a HTTP response header, instead of as a meta tag.
This is a much cleaner solution than placing it above the <html> tag.
A confusing useful blog post concerning X-UA-Compatible and its many intricacies:
http://farukat.es/journal/2009/05/245-ie8-and-the-x-ua-compatible-situation
Two possibilities:
The meta tag definitely belongs into the <head> section of the document.
If this is in an Intranet, this may be IE's "Smart default" kicking in. Yes, there is such a thing as smart defaults. See here. Because if you're in an Intranet, IE8 will automatically go into IE7 compatibility mode so as not to break the many corporate apps that rely on IE7. Makes sense, right? Right?