examples of position absolute
1) In our example below div with id= parent is the parent element and div1 , span1, span2 and div2 are its' children. We will use the position: absolute property and its' offset properties on div2 element.
CASE 1) When position absolute is not used on div2
The child div2 (green colour) does not show any change.
CASE 2) When position absolute is used on div2 and offset properties of top=0 and left =0 is given, let us assume that no other element has the position absolute/relative property with them in the DOM tree, so the parent of div2 will be the body and it will move according to the boundary of the body.
Now the div2( green colour ) has moved in accordance to the body, since it was 0px from the top, it has moved all the way up to the top and also it was 0px from the left, so it has moved completely from the right of the parent(body) to the left. Also a thing to note is that whenever, position absolute is used the box element will behave like inline-block element like the div2 did in the above example,





Comments
Post a Comment