Eigenschaft right
Die Eigenschaft right legt die Position der
rechten Kante eines Elements fest. Werte für die Eigenschaft können
mit gebräuchlichen Größeneinheiten angegeben werden,
z.B. in Pixeln, Zoll, Punkten, Prozent.
Die angegebenen Werte können auch negative Zahlen sein,
in diesem Fall überlagern sich die Elemente gegenseitig.
Die Koordinatenzählung wird durch die Eigenschaft position bestimmt,
die normalerweise den Wert relative
(relative Position) oder absolute
(absolute Position) annimmt.
Syntax
Selektor {
right: Größe oder auto;
}
Beispiel
Lassen Sie uns beim Überfahren des Kindelements
die Position seiner rechten Grenze
auf 25px setzen:
<div id="elem">
<p></p>
</div>
#elem {
width: 400px;
height: 300px;
border: 1px solid black;
}
p {
position: relative;
width: 100px;
height: 100px;
border: 1px solid red;
margin-left: 50px;
}
p:hover {
right: 25px;
width: 100px;
height: 100px;
border: 1px solid red;
}
:
Beispiel
Und jetzt soll beim Überfahren die rechte Grenze
des Kindelements
bei -50px positioniert sein:
<div id="elem">
<p></p>
</div>
#elem {
width: 400px;
height: 300px;
border: 1px solid black;
}
p {
position: relative;
width: 100px;
height: 100px;
border: 1px solid red;
margin-left: 50px;
}
p:hover {
right: -50px;
width: 100px;
height: 100px;
border: 1px solid red;
}
:
Siehe auch
-
die Eigenschaft
bottom,
die die Position der unteren Kante des Elements festlegt -
die Eigenschaft
top,
die die Position der oberen Kante des Elements festlegt -
die Eigenschaft
left,
die die Position der linken Kante des Elements festlegt -
das Pseudoelement
::backdrop,
das die Positionierung nach dem ersten Element festlegt