Will an iframe render in quirks mode?
I'm working on setting up a page and am having difficulty with getting it to look well across browsers (actually just IE, as it renders properly for mozilla and webkit). I'm wanting to rule out quirks mode before seriously considering old IE bugs fixed since IE6. The container page has a declared doctype, however the iframe code does not. Will the iframe content be rendered in quirks-mode (because it does not have a doctype) or standards mode (because the container has a doctype)? The source follows this scheme:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
...
<body>
...
<iframe ...>
<html>
<head>
...
</head>
<body>
....
</body>
</html>
</iframe>
...
</body>
</html>
Answer
Prior to IE9, the webpage within the iframe would render according to its own doctype, not according to the doctype of the parent container. However, in IE9, Microsoft changed the behavior so that the child iframe inherits its doctype/rendering from the parent container.
Note that IE9 will still behave in the traditional manner (iframe honors its own doctype) whenever compatibility view is used.
The best workaround for folks in your situation--writing a standards compliant container page but needing to include an iframe with a quirks mode page--is to add either of the following meta tags between your doctype and the opening tag in the parent page.
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7">
<meta http-equiv="X-UA-Compatible" content="IE=8" />
These tags will essentially tell IE9 to pretend it is IE7 or IE8. Including in the emulation is the logic used to determine rendering mode for the child iframe. The downside of this workaround is that you will not be able to use any of the new features supported by IE9 in your parent page, but that is probably preferable to massive rendering errors in the child page.
See http://web.archive.org/web/20110905060718/http://www.sitepoint.com/forums/html-xhtml-52/ie9-iframes-doctypes-you-743000.html for more information.