HTML, CSS / Выравнивание элементов по центру по вертикали, горизонтали. Способ 1. Древний.

html, css

Способ надежный, но для .wrap нельзя задать размеры в %. Плохо подходит для адаптива.
-----------

HTML

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

CSS

.wrap {
	width: 400px;
	height: 400px;
	display: table-cell; 
	/* Вертикальное выравнивание содержимого блока работает только в ячейках таблицы. Превращаем блок в ячейку */
	vertical-align: middle;
	text-align: center;
}

.content {
	width: 200px;
	height: 200px;
	display: inline-block; 
	/* Горизонтальное выравнивание работает только для строчных элементов. Превращаем блок в строчный снаружи элемент */
}

/* Для вложенных строчных элементов, в т. ч. для img, "display: inline-block" не требуется */