right

  • Revision slug: CSS/right
  • Revision title: right
  • Revision id: 25244
  • Created:
  • Creator: BijuGC
  • Is current revision? No
  • Comment

Revision Content

{{ CSSRef() }}

Summary

The right property specifies part of the position of positioned elements.

For absolutely positioned elements (those with {{ Cssxref("position") }}: absolute or position: fixed), it specifies the distance between the right margin edge of the element and the right edge of its containing block.

  • {{ Xref_cssinitial() }}: {{ Cssxref("auto") }}
  • Applies to: positioned elements
  • {{ Xref_cssinherited() }}: no
  • Percentages: refer to height of containing block
  • Media: {{ Xref_cssvisual() }}
  • {{ Xref_csscomputed() }}: absolute length, percentage, or auto

Syntax

right: <length> | <percentage> | auto | inherit ;

Values

{{ Xref_csslength() }} 
A length, can be negative, zero, or positive.
{{ Xref_csspercentage() }} 
A percentage of the containing block's width.

Examples

{{ CSSRefExampleLink("right") }} {{ Fixeg() }}

div { 
   position: absolute;
   right: 20px; 
   height: 200px;
   border: 1px solid #000;
}

Notes

Specifications

Browser compatibility

{{ Fixbrowser() }}

Browser Lowest Version
Internet Explorer ?
Firefox 1
Netscape ?
Opera ?
Safari ?

See also

{{ Cssxref("position") }}, {{ Cssxref("top") }}, {{ Cssxref("bottom") }}, {{ Cssxref("left") }}

{{ languages( { "es": "es/CSS/right" } ) }}

Revision Source

<p> {{ CSSRef() }}
</p>
<h3 name="Summary"> Summary </h3>
<p>The <code>right</code> property specifies part of the position of positioned elements.
</p><p>For absolutely positioned elements (those with {{ Cssxref("position") }}<code>: absolute</code> or <code>position: fixed</code>), it specifies the distance between the right margin edge of the element and the right edge of its containing block.
</p>
<ul><li> {{ Xref_cssinitial() }}: {{ Cssxref("auto") }}
</li><li> Applies to: <a href="en/CSS/position">positioned elements</a>
</li><li> {{ Xref_cssinherited() }}: no
</li><li> Percentages: refer to height of containing block
</li><li> Media: {{ Xref_cssvisual() }}
</li><li> {{ Xref_csscomputed() }}: absolute length, percentage, or auto
</li></ul>
<h3 name="Syntax"> Syntax </h3>
<pre class="eval">right: &lt;length&gt; | &lt;percentage&gt; | auto | inherit ;
</pre>
<h3 name="Values"> Values </h3>
<dl><dt> {{ Xref_csslength() }} </dt><dd> A length, can be negative, zero, or positive.
</dd><dt> {{ Xref_csspercentage() }} </dt><dd> A percentage of the containing block's width.
</dd></dl>
<h3 name="Examples"> Examples </h3>
<p>{{ CSSRefExampleLink("right") }} {{ Fixeg() }}
</p>
<pre class="eval">div { 
   position: absolute;
   right: 20px; 
   height: 200px;
   border: 1px solid #000;
}
</pre>
<h3 name="Notes"> Notes </h3>
<h3 name="Specifications"> Specifications </h3>
<ul><li> <a class="external" href="http://www.w3.org/TR/CSS21/visuren.html#propdef-right">CSS 2.1</a>
</li><li> <a class="external" href="http://www.w3.org/Style/CSS/current-work#positioning">CSS 3</a>
</li></ul>
<h3 name="Browser_compatibility"> Browser compatibility </h3>
<p>{{ Fixbrowser() }}
</p>
<table class="standard-table"> <tbody><tr> <th>Browser</th> <th>Lowest Version</th> </tr> <tr> <td>Internet Explorer</td> <td>?</td> </tr> <tr> <td>Firefox</td> <td>1</td> </tr> <tr> <td>Netscape</td> <td>?</td> </tr> <tr> <td>Opera</td> <td>?</td> </tr> <tr> <td>Safari</td> <td>?</td> </tr>
</tbody></table>
<h3 name="See_also"> See also </h3>
<p>{{ Cssxref("position") }}, {{ Cssxref("top") }}, {{ Cssxref("bottom") }}, {{ Cssxref("left") }}
</p>
<div class="noinclude">
</div>
{{ languages( { "es": "es/CSS/right" } ) }}
Revert to this revision