Dynamic HTML: The Definitive Reference, 3rd Edition

Chapter ONLINE SECTION V. Adding Dynamic Positioning to Documents

Now a part of Cascading Style Sheets Level 2, element positioning standards began life as a CSS1 supplement, called CSS-Positioning (or CSS-P for short). CSS properties that govern positioning are a well-defined subset of CSS, but when the W3C DOM CSS Working Group divided CSS Level 3 into modules, the properties got spread across multiple modules. For the sake of simplicity, however, this chapter refers to this group of properties as CSS-P.

A fundamental concept of positioning is direct control of the placement of elements on the page, when the browser-controlled flow of content can’t meet your design requirements. To accomplish element positioning, a browser must be able to treat positionable elements as layers that can be dropped anywhere on the page, even overlapping other fixed or positionable elements—something that normal HTML rendering scrupulously avoids.^[*]

The notion of layering adds a third dimension to a page, even if a video monitor (or a printed page) is undoubtedly a two-dimensional realm. That third dimension—the layering of elements—is of concern to you as the author of positionable content, but is probably of no concern to the page’s human viewer.

While the primary focus of the CSS-P recommendation is the way an author lays out elements in a document, the IE 4 and W3C DOMs expose CSS positioning properties as scriptable properties that can be changed in response to user action. You have the opportunity ...