CSS lets you position items both relatively and absolutely on a web page. The use of relative positioning makes sense when your layouts need to be flexible to accommodate various browsers and hardware. But how useful is absolute positioning? More than you might think.
CSS: Building Tooltips with Absolute Positioning (Page 1 of 4 )
Since the release of CSS long years ago, absolute positioning has been seen by many people as one of its most evil villains -- and to be frank, this fame is justified. How useful can this feature be in an elastic and extremely dynamic media like the web, where page layouts must be designed to accommodate a plethora of resolutions and devices? Not very, really.
The truth is, on its own, the functionality of absolute positioning is very limited, not to say non-existent, at least in production environments. The good side of this story, however, is that when coupled with an appropriate partner, this property can be of great help in the design of fixed layouts and even in the implementation of certain features on web pages.
You still don’t have a clue about the mysterious partner? Well, here’s a heads up: in reality, when used in conjunction with a relatively-placed parent, an element absolutely positioned in an (X)HTML document can be very helpful. This is especially true where it’s necessary to overlap multiple containers or keep a fixed distance in pixels between them. Common uses of the relative/absolute tandem include, among other things, the construction of drop-down menus, CSS-based tooltips, and more.
So, if the topic has caught your attention, over the course of this article series I’m going to demonstrate how to use this rather tricky combination for developing the aforementioned user interface elements, and best of all, without having to appeal to the complexities of JavaScript. Let’s jump in!
Style Sheets 
HTML5 Boilerplate Introduction
