The assignment was to go to the W3C Web site and locate information on two new positioning features of CSS2. Then to check both the Microsoft and Netscape sites to see if either of their fifth-generation browsers would support the positioning features I chose to examine. |
I took this bit of information from the W3C site itself. Check out A Quick Tour of CSS2 for more infomation. |
The idea behind positioning is fairly simple. It allows the author to define exactly where element boxes will appear, relative to where they would ordinarily be -- or relative to the browser window itself. The power of this is both obvious and surprising. What shouldn't be too surprising is that this is the part of CSS2 that both major browsers are currently trying to support. |
Unfortunately, positioning support is sketchy enough that it's almost impossible to provide working examples. But the effects are easy enough to describe. Let's say you have a page laid out in a three-cell table something like this: |
| Cell 1 | Cell 2 |
| Cell 3 |
Once you break it down, of course, you have three chunks of information -- the contents of each cell. So let's get rid of the table markup, and wrap each chunk of information in DIV tags. Now we simply add some positioning rules, and discover that the page looks just as it did to begin with, except without any table markup whatsoever! |
We can take this further. Using positioning markup, it is possible to recreate frame-type layouts without any sort of frames markup whatsoever. With just a few declarations, all of the content in a single document can be arranged in a way that only frames could do before -- and all of the information is in a single page. No more messing around with NOFRAMES tags and duplication of content across multiple documents. Positioning can take care of all of this! |
In my opinion, this is the single most important new area of the CSS2 specification. It can make the job of Web authors much easier, allow for document display in any browser, and make it much easier for search engines to index documents. It is hoped that both Microsoft and Netscape put implementation of this section of the CSS2 specification very high on their respective "to-do" lists (right below creating a full, stable implementation of CSS1). |
In a sort of accompaniment to the positioning properties that let you set an element's horizontal positioning, z-index lets you determine an element's "vertical" position. Since (thanks to positioning properties) elements can overlap each other, it makes sense that you should be able to define which are "in front" or "on top" of others. That's what z-index will do. |