Thursday, May 31, 2012

CSS position property

The CSS position property takes 5 values.

    position: absolute
An absolute positioned element is positioned relative to the first parent element that has a position other than static. If no such element is found, the containing block is <html>. It is removed from normal flow. Sometimes we float columns with clear, instead of using relative position and absolute position.

    position: relative
A relative positioned element is positioned relative to its normal flow, using top, right, bottom, and right. It also it establishes a context for position:absolute. It still occupies that original space in the normal flow.

    position: fixed
An element with fixed position is positioned in relation to the browser window. It is removed from normal flow as absolute positioned element. It is common to see fixed position for twitter-like header, though IE6 needs some hack.

    position: static
This is the default value if no CSS position specified. The element is not positioned, and is part of the normal flow of the page.

    position: inherit
The element uses the position of its parent. The value from parent element position can be one of static, relative, absolute and fixed.

No comments:

Post a Comment