Sunday, August 05, 2007

Henri Sivonen: Activating the Right Layout Mode Using the Doctype Declaration

Itt van az egesz, de par dolgot bemasolok:

In order to deal with both old tag soup written to old browser quirks and new CSS-compliant pages, Firefox (and other Mozilla Gecko-based browsers), Safari, Opera (7 and later), Internet Explorer 6 and 7, Mac IE 5, and Konqueror (3.2 and later) have two main layout modes. In one mode the layout engine attempts to render conforming pages according the CSS specifications. In the other mode the layout engine tries to mimic old browsers. In Firefox these modes are known as “the Standards mode” and “the Quirks mode” respectively. In this document the same names are used also when referring to the modes of the other browsers.

Background

The bugs and non-standard behaviors of old browsers such as Netscape Navigator 4.x and IE 5 for Windows are called “quirks”. For example, not inheriting styles into tables is a quirk. Sometimes pages have been authored in such a way that their layout depends on quirks.

Most quirks are related to layout and, hence, are in conflict with CSS. Rendering quirky pages according to CSS would make them look different from what the author most likely intended. On the other hand, being able to use CSS as specified is a big win compared to writing for old quirks forever.

Layout Modes

To address the conflicting goals of backwards compatibility and CSS conformance, contemporary browsers have two or three layout modes.

Quirks Mode

In the Quirks mode the browsers violate CSS specifications in order to achieve backwards compatible layout. Different browsers implement different quirks. Therefore, “Quirks mode” is not a single target. For example, Mozilla focused on imitating Netscape 4.x initially. Windows IE 6 and 7, on the other hand, are focused on imitating Windows IE 5.

The point of the Quirks mode is avoiding “breaking” old pages. If you are authoring new pages now, you are supposed to comply with the relevant specifications (CSS 2.1 in particular) and target the Standards mode.

Standards Mode

In the Standards mode the browsers try to give conforming documents the specification-wise correct treatment to the extent implemented in a particular browser.

Almost Standards Mode

Firefox, Safari and Opera 7.5 (and later) also have a third mode known as “the Almost Standards mode”, which implements the vertical sizing of table cells traditionally and not rigorously according to the CSS2 specification. Mac IE 5, Windows IE 6 and 7, Opera prior to 7.5 and Konqueror do not need an Almost Standards mode, because they don’t implement the vertical sizing of table cells rigorously according to the CSS2 specification in their respective Standards modes anyway. In fact, their Standards modes are closer to Mozilla’s Almost Standards mode than to Mozilla’s Standards mode. It is important to remember that even though the various browsers have conceptually similar modes, the corresponding modes of the different browsers are not identical.

Firefox, Safari, Opera (7 and later), Windows IE 6 and 7, Mac IE 5 and Konqueror (3.2 and later) all use doctype sniffing in order to decide the layout mode for text/html documents. This means that the mode is picked based on the document type declaration (or the lack thereof) at the beginning of an HTML document. (Documents served using an XML content type always get the Standards mode.)

Szinten itt talalhato egy tablazat is arrol, hogy melyik browser melyik doctype-ot hogyan rendereli.

++++

Anne van Kesteren pedig keszitett egy tablazatot arrol, hogy a browserek hogyan impelementaljak a clientHeight, offsetHeight es scrollHeight-ot a body es html tagen quirks es standards mode-ban.