Left-ominaisuus

Ominaisuus left asettaa elementin vasemman reunan sijainnin. Ominaisuuden arvot voidaan kirjoittaa yleisesti hyväksytyillä mittayksiköillä, esimerkiksi pikseleinä, tuumina, pisteinä, prosentteina. Asetettavat arvot voivat olla myös negatiivisia lukuja, tässä tapauksessa elementit asettuvat päällekkäin. Koordinaattien laskenta määräytyy ominaisuuden position perusteella, joka yleensä saa arvon relative (suhteellinen sijainti) tai absolute (absoluuttinen sijainti).

Syntaksi

valitsija {
	left: koko tai auto;
}

Esimerkki

Asetetaan lapsielementille vasemman reunan sijainti arvoksi 25px kun kursorilla viitataan siihen:

<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;
}

Esimerkki

Asetetaan nyt lapsielementin vasen reuna sijaintiin -50px kun kursorilla viitataan siihen:

<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;
}

Katso myös

ominaisuus bottom,
joka asettaa elementin alareunan sijainnin
ominaisuus top,
joka asettaa elementin yläreunan sijainnin
ominaisuus right,
joka asettaa elementin oikean reunan sijainnin
pseudoelementti ::backdrop,
joka asettaa sijainnin ensimmäisen elementin jälkeen