Subject: CSS Position: Absolute
Author: CyberSpider
In response to: CSS Position: Relative
Posted on: 04/17/2016 04:38:52 PM
Now let's change relative to absolute
#box3 {
background-color: blue;
position: absolute;
top: 30px;
left: 20px;
}
The blue box has been taken away from the normal flow as if it were not there (not even the occupied space). It is now placed at
30px from
top and
20px from
left,
absolutely from the root document or its parent container (the parent container must declare as position:relative).
>
> On 04/17/2016 05:59:50 AM
CyberSpider wrote:
On above example, change only static to relative
#box3 {
background-color: blue;
position: relative;
top: 30px;
left: 20px;
}
Try it yourself in sandbox »
Now you can notice that the blue box (Box#3) has shifted a little bit. The exact amount of shifting is 30px from top and 20px from left, relatively compared to its normal position.
References:
