1. Absolute Absolute positioning is absolute in relation to the parent element. In this case the parent element is the whole document, so the div is positioned absolutley at 0,0 and will apear in the top left corner.
2. Relative This positions the element relative to where it would have been in the document. Useful for moving something down or across a few pixels for example. In the diagram, the black dashed outline shows where the div would have been without positioning.
3. Relative and Absolute An example of absolute and relative positioning. The outer green box is positioned relative to where it would have been, whilst the inner box is positioned absolutely in relation to the parent green box.
4. float This is where the element in question “hovers” left or right, much like aligning an image left or right works in plain HTML.
6. 3 Column layout Here’s where it gets fun. Below is a classic 3 column layout with the left and right DIV floated correspondingly left and right, and the middle DIV without any positioning at all.