Difference between position absolute and static?

Difference between position absolute and static?

Basically CSS position property used to place/positioned an element on the web page. It uses top, left, right and bottom values to position an element. This property have following values.

  1. static
  2. absolute
  3. relative
  4. fixed
  5. sticky

1) static

This is the default value for an element. If the position is not defined for an element, we can assume position static is assigned to that element by default.

2) absolute

Values are considered from relative to the parent element if the parent has position value otherwise it will always considered from HTML tag.

3) relative

It also same as absolute but it considered from parent element instead of browser window.

4) fixed

Element positioned from browser window.

5) sticky

Element positioned on a particular location even the user scroll the page. The element is positioned on the same location until the parent element has space.

 

Please post your comments below if you have any questions.