Open main menu

CDOT Wiki β

Changes

CSS GUIDE RIGHT

2,164 bytes added, 23:57, 11 December 2006
no edit summary
<span style="margin:0;background:#ffff33;font-size:120%;font-weight:bold;border:1px solid #a3b0bf;text-align:left;color:#000;padding:0.2em 0.4em;">This document is a work in progress and is subject to change.</span><br /><br />
== Summary ==
The left proprighterty is used to horizontally offset from the right edge of an element.
<table border="0">
<tr>
<td><b>Applicability:</b></td><td>The right property can be used for all CSS elements.<td>
</tr>
<tr>
<td><b>[http://developer.mozilla.org/en/docs/CSS:%40media#Media_groups Media Group:]</b>
</td><td>Visual</td>
</tr>
<tr>
<td><b>Inherited:</b></td><td>No</td>
</tr>
<tr>
<td><b>Default Value:</b></td><td>auto</td>
</tr>
</table>

== Syntax ==
<pre>
TARGET_ELEMENT{right: inhert !important}
TARGET_ELEMENT{right: auto}
TARGET_ELEMENT{right: 20%}
TARGET_ELEMENT{right: 20px}
</pre>

== Legal Values ==
<table border="1" cellspacing="2" cellpadding="5">
<tr>
<th align="left">Value</th><th align="left">Description</th>
</tr>
<tr>
<td>inherit</td><td>Explicitly sets the value to that of the parent</td>
</tr>
<tr>
<td>auto</td><td>Allows the browser to calculate the right position of the element</td>
</tr>
<tr>
<td>percentage</td><td>Sets the right position in a percentage from the right edge. Can be 0%-100%</td>
</tr>
<tr>
<td>length</td><td>Sets the right position in pixels (px), centimeters (cm), etc, from the right edge.</td>
</tr>
</table>

== Mozilla Recommended Values ==

== Usage Examples ==
<pre>
p{
position: absolute;
right: 20px
}

img{
position: absolute;
right: 15%
}

div{
position: absolute;
right: auto
}
</pre>

== Notes ==
When right property is used with the position property, if the position property has a value of "static", the right property has no effect on the element.

== Specification Conformance ==
*CSS 1
*[http://www.w3.org/TR/REC-CSS2/visuren.html#propdef-right CSS 2.1]
*CSS 3

== Browser Compatibility ==

== See Also ==
* [http://zenit.senecac.on.ca/wiki/index.php?title=CSS_GUIDE_LEFT left property]
* [http://zenit.senecac.on.ca/wiki/index.php?title=CSS_GUIDE_BOTTOM bottom property]
* [http://zenit.senecac.on.ca/wiki/index.php?title=CSS_GUIDE_TOP top property]
1
edit