Свойство left

Свойство left задава позицията на левия ръб на елемента. Стойности за свойството могат да бъдат зададени с общоприетите мерни единици, например в пиксели, инчове, точки, проценти. Задаваните стойности могат да бъдат и отрицателни числа, в този случай елементите ще се наслагват един върху друг. Отброяването на координатите се определя от свойството position, което обикновено приема стойност relative (относително позициониране) или absolute (абсолютно позициониране).

Синтаксис

селектор {
	left: размер или auto;
}

Пример

Нека при посочване на дъщерния елемент да зададем позиция на левия му ръб равна на 25px:

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

Пример

А сега нека при посочване левият ръб на дъщерния елемент да бъде позициониран на -50px:

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

Вижте също

свойство bottom,
което задава позицията на долния ръб на елемента
свойство top,
което задава позицията на горния ръб на елемента
свойство right,
което задава позицията на десния ръб на елемента
псевдоелемент ::backdrop,
който задава позициониране след първия елемент