Untitled

<!DOCTYPE html>
<html>
<head>
	<title>Absolute positions</title>
	<style type="text/css">
		body {
			background-color: blue;
		}
		.left50Only {
			position: absolute;
			left: 50%;
			width: 100px;
			height: 100px;
			background-color: yellow;
		}
		.left50WithTransform {
			position: absolute;
			left: 50%;
			transform: translateX(-50%);
			width: 100px;
			height: 100px;
			top: 150px;
			background-color: red;
		}
	</style>
</head>
<body>
	<div class="left50Only"></div>
	<div class="left50WithTransform"></div>
</body>
</html>