DOCTYPE switching
Many browsers have more than one rendering mode based on the <doctype ...> declaration used. These changes are
expected. However, Internet Explorer 6+ makes several changes that are more unexpected and in most cases, totally unwanted.
The most significant changes made by Internet Explorer 6+ when in 'standards compliant mode' are outlined below.
Microsoft provide their own documentation of these changes on their site.
The following declarations switch IE 6+ into 'standards compliant mode'. Others may also cause it to switch. Although the non-standards Microsoft model is not standards compliant, the popularity of the browser and the difficulty involved in supporting its 'standards compliant' mode may be incentive enough to avoid them altogether.
<!doctype html public "-//W3C//DTD HTML 4.0//EN">
<!doctype html public "-//W3C//DTD HTML 4.0 Strict//EN">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<!doctype html public "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">HTML layout changes
Pages in framesets are laid out assuming there is no vertical scrollbar. When the page is long enough for there to be a vertical scrollbar, the pages are laid out behind the scrollbar. So that you can see the whole page, a horizontal scrollbar is also shown - unsightly and usually unwanted.
This bug can be removed using a complicated CSS technique, using only one line of CSS, targetted to IE 6 only using a conditional comment. The CSS uses the proprietary expression() to make IE compute a more appropriate width.
<!--[if IE 6]><style style="text/css">
body { width: expression( ( document.documentElement.clientWidth - 20 ) + 'px' ); }
</style><![endif]-->Keep this CSS separate from other CSS stylesheets in your document, and make sure it is the last stylesheet in your document.
I have read reports that <td> tags align center not left as usual, but I cannnot replicate this. It may be due to a <doctype ...> declaration that I did not test.
JavaScript changes
All window and scrolling measurements are put as children of the documentElement object, not the body object as before. The body object still has the same child properties but now they give the size of the document, not the window. Easy to catch programmers out with this one.
My window size and scrolling page shows how to avoid problems.