This is a simple example to show how absolutely positioned blocks can be positioned within a relatively positioned container. Try resizing your browser, and you'll see how the whole blue block moves, but the absolutely positioned blocks inside it stay put relative to each other. Meanwhile the maroon box is not inside the blue box, but just inside the <body> so it stays put relative to the browser window. The key for controling this is the position: statement of the containing block. This sets the positioning context for the child elements.
The green block is included to show one technique for centering absolutely positioned content.
To see what this would look like with relative positioning, click here
For a thorough explanation of the CSS positioning concepts, check out this: http://www.quirksmode.org/css/position.html