right

Browser Internet Explorer Netscape Opera Safari Firefox
Version 5.5 6.0 7.0 8.0 8.0 9.0 7.0 8.0 9.2 9.5 1.3 2.0 3.1 1.5 2.0 3.0
Supported Yes Yes Yes Yes Yes Yes Yes Yes Yes Yes Yes Yes Yes Yes Yes Yes

Short information
CSS CSS2
Default value auto
Inherited No
Applied To all elements
HTML analog No
Reference to specification http://www.w3.org/TR/CSS21/visuren.html#propdef-right

Description
This parameter defines distance from a right border of a parental element to a right border of an affiliated element not including a space, a field and width of a framework (fig. 1). Readout of coordinates depends on parameter position value. If its argument is equal absolute, in this case the parent is the browser window. An element position is defined from right border. In case of value relative the argument right is counted from a right border of an element starting position.


Syntax

right: value | percent | auto

Arguments
Any units of length accepted in CSS are applied as values, for example pixels (px), inches (in), points (pt), etc. Value of parameter right can be negative. In this case superpositions of different elements against each other are possible. If you specify the value in percent, the element position will be calculated depending on parental element width. The argument auto does not change the element position.

Example

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
  <title>right</title>
  <style type="text/css">
   #leftcol { 
    position: absolute; /* Absolute positioning */
    top: 20px; /* Location from the top edge */
    left: 20px; /* Location from the left edge */
    width: 100px; /* Block width */
    background: #fc3; /* Background color */
    border: 1px solid #000; /* Frame parameters */
    padding: 10px; /* Fields around the text */
   } 
   #centercol { 
    position: relative; /* Relative positioning */
    background: maroon; /* Background color */
    padding: 10px; /*  Fields around the text */
    color: white; /* Text color */
    margin: 13px 250px 0 130px; /* Indents around the block */
   }
   #rightcol { 
    position: absolute; /* Absolute positioning */
    top: 20px; /* Location from the top edge */
    right: 20px; /* Location from the right edge */
    width: 200px; /* Block width */
    background: #ccc; /* Background color */
    border: 1px solid black; /* Frame parameters */
    padding: 10px; /* Fields around the text */
   }
  </style>
 </head>
 <body> 
 
  <div id="leftcol">leftcol</div>
  <div id="centercol">centercol</div>
  <div id="rightcol">rightcol</div>
 
 </body>
</html>

The result of this example is shown on the figure 2


Object model

[window.]document.getElementById("elementID").style.right
Cloud Computing
Cloud Backup Services
Cloud Backup
Backup Server