CSS/Properties/position

From Web Education Community Group
Jump to: navigation, search

position

The position property specifies the positioning algorithms for an elements.

Description

Values static | relative | absolute | fixed | inherit
Initial value static
Applies to All elements
Inherited No


Values

  • static
    The box is a normal box, laid out according to the normal flow. The 'top', 'right', 'bottom', and 'left' properties do not apply.


  • relative


  • absolute
    The box's position (and possibly size) is specified with the 'top', 'right', 'bottom', and 'left' properties.


  • fixed
    Normal behavior. The top, right, bottom, and left properties do not apply.


  • inherit
    Takes the same specified value as the property for the element's parent.


Example

Example A

[style.css]

 h1{
   position: absolute;
   top: 100px;
   left: 50px;
}

[index.html]

<body>
  <h1>position property</h1>
  <p>This is a paragraph.</p>
</body>

Csslist2 position.png

CSS Reference

The CSS specification defines the position property in 9.3.1 Choosing a positioning scheme.