Eigenschaft left

Die Eigenschaft left legt die Position der linken Kante eines Elements fest. Werte für die Eigenschaft können mit den 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. Die Koordinatenzählung wird durch die Eigenschaft position bestimmt, die normalerweise den Wert relative (relative Positionierung) oder absolute (absolute Positionierung) annimmt.

Syntax

Selektor {
	left: Größe oder auto;
}

Beispiel

Lassen Sie uns beim Überfahren des Kindelements die Position seines linken Randes 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 {
	left: 25px;
	width: 100px;
	height: 100px;
	border: 1px solid red;
}

Beispiel

Und nun soll beim Überfahren der linke Rand 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 {
	left: -50px;
	width: 100px;
	height: 100px;
	border: 1px solid red;
}

Siehe auch

die Eigenschaft bottom,
die die Position der unteren Kante eines Elements festlegt
die Eigenschaft top,
die die Position der oberen Kante eines Elements festlegt
die Eigenschaft right,
die die Position der rechten Kante eines Elements festlegt
das Pseudoelement ::backdrop,
das die Positionierung nach dem ersten Element festlegt