HTML, CSS / Выравнивание нижнего края элемента по центру окна браузера

html, css

HTML

<div class="wrap">
	<div class="content"> </div>
</div>

CSS

.wrap {
	background-color: green;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	/* Растягиваем элемент на весь экран. */
	vertical-align: middle;
	text-align: center;
}

.wrap:before {
	content: "";
	display: inline-block;
	height: 100%;
	width: 0px;
	vertical-align: middle;
}

.content {
	width: 200px;
	height: 150px;
	background-color: red;
	display: inline-block;
}