The right property specifies the distance from the right of the element to the default location of the element (when position=relative) or the distance between the right of the element and the right edge of the container (when position=absolute). This can be specified as a percentage, as a length, or 'auto'.
Let's illustrate with two examples:
Example 1
CSS Code
|
div {
background-color:#FF00FF;
width:250px;
height:60px;
}
p {
text-aligh:right;
}
|
The HTML code,
<div>
<p>No right property.
</div>
|
renders
|
|
div {
background-color:#FF00FF;
width:250px;
height:60px;
}
p {
text-align:right;
position:relative;
right:30px;
}
|
<div>
<p>Apply right:30px.
</div>
|
|
In the above example, we see applying the {position:relative; right:30px;} style shifts the text 30 pixels away from the original location.
Example 2
CSS Code
|
div {
background-color:#FF00FF;
width:250px;
height:60px;
}
p {
text-aligh:right;
}
|
The HTML code,
<div>
<p>No right property.
</div>
|
renders
|
|
div {
background-color:#FF00FF;
width:250px;
height:60px;
}
p {
text-align:right;
position:relative;
right:30%;
}
|
<div>
<p>Apply right:30%.
</div>
|
|
In the above example, we see applying {position:relative; right:30%;} shifts the text 30% (75 pixels) away from the original location.
Next: CSS Overflow
Link to this page: If you find this page useful, we encourage you to link to this page. Simply copy and paste the code below to your website, blog, or profile.
More Tutorials: SQL PHP HTML
Copyright 2007-2009 1keydata.com All Rights Reserved. Privacy Policy
|
|