<< Back to main menu

Absolute

In this layout, #div_2 has the positioning property of absolute and placement values applied to the top and right sides. Absolute positiong places the <div> in relation to the edges of the page. By doing this, #div_2 is now independent of the original layout. Note that #div_3 has moved up to take the space formerly occupied by #div_2

#div_1 {
background-color: #CCC;
padding: 10px;
width: 500px;
}

#div_2 {
background-color: #FC0;
padding: 10px;
width: 500px;
position: absolute;
top: 50px;
right: 0px;
}
#div_3 {
background-color: #FF9;
padding: 10px;
width: 500px;
}