There are lots of web pages which describe what the css position alterantives of fixed, static, relative and absolute do. That's easy - you just go through them one at a time and say what they do, with reference to w3c web standards for css 2.1
But how do you decide how to use these options? You have to think about all four together, and what you might be trying to do, and the effect of combining them. I'll ignore float to start with.
You can position an element by positioning it itself, or by putting it inside a containing element, and positioning that. The containing element is typically a div, for block style, or a span for inline. Of course you could switch this around by saying in a style sheet
but that way madness lies.
It looks at first that absolute is most powerful, since you can put it precisely where you want. But you normally have to position things in relation to other things - in particular, you don't (usually) want one thing on top of another - which absolute positioning might well result in.
For example, you might use absolute to place something after some other content. Then you add more content - so you have to alter the co-ordinates of the absolutely-positioned element. This is precisely what normal flow = position:static; does for you anyway. So we might put the question another way - when do we not want normal flow?
The content above this is in a div with a width limited to 600px. That produced blocks of text which were quite easy to read - but this is out of that div, and the parent of this element is the html body - which is set with zero margin and padding. This wide width of text is far harder to read. Again there is a historical element to this - in the first days of the www, screen widths were often 640 px, so you couldn't get much width even if you tried. Now most screens are greater than 1000px, and reading text becomes like watching a match at Wimbledon. Doesn't it?
This is now in another div, which is styled in the html like this:
Syntax highlighting by Alex Gorbatchev