CSS: Absolute and Relative Positioning?

Hey it's me again with yet, another CSS question. My CSS studies are going fine( ), but I'm not quite sure what Relative and Absolute positioning are. From reading some articles on the web, they're quite tricky to understand. Can anyone explain to me what they do, their difference, and why I need them? Thanks again!

as far as i know, relative positioning is how an element is positioned relative to a block level element

and absolute positioning is when an element is positioned relative to 0, 0 on the X, Y axis respectively (0, 0 being the top leftmost position in the coordinate graph)

Originally Posted by Koobi as far as i know, relative positioning is how an element is positioned relative to a block level element and absolute positioning is when an element is positioned relative to 0, 0 on the X, Y axis respectively (0, 0 being the top leftmost position in the coordinate graph)

Relative is the positioning inside the container that holds the element. You can have negative values for relative.

Absolute is the positioning out of context of the rest of the page, it will sit on top of everything else and positions itself according to the top left of the page.

Originally Posted by Julian ... and positions itself according to the top left of the page.

Or, the 'nearest positioned ancestor'. If a containing element is positioned using relative then the zero co-ordinates will be taken from the top and left of that element.

Generally, people new to this (or for simplicity) don't often position things all too much so the 'nearest positioned ancestor' is the document itself (body element) which is what Julian was referring to.

...

Hey, thanks for all of your replies. I understand the general difference I'll do more reading on them, and they're making sense now You guys are great.