|
The relative value of the position property specifies how the element will be positions relative to how it would have been positioned by default. It is used in combination with a direction (top, bottom, left, and right). Let's view an example of relative position in action:
CSS Code
|
div {
background-color:#FF00FF;
width:250px;
height:60px;
}
p {
}
|
The HTML code,
<div>
<p>Example to show relative position.
</div>
|
renders
Example to show relative position.
|
|
div {
background-color:#FF00FF;
width:250px;
height:60px;
}
p {
position:relative;
top:15px;
}
|
<div>
<p>Example to show relative position.
</div>
|
Example to show relative position.
|
In the above example, applying the {position:relative; top:15px;} style added 15px of space on top of the text. In other words, this style shifted the text down by 15px relative to the default position.
Next: CSS Fixed
Copyright © 2013 1keydata.com All Rights Reserved Privacy Policy
|