div centered horizontally and vertically

Center DIV вертикальное выравнивание

//first example (works good)
	background: red
	position: absolute
	color: #fff
	top: 50%
	left: 50%
	padding: 15px
	-ms-transform: translateX(-50%) translateY(-50%)
	-webkit-transform: translate(-50%,-50%)
	transform: translate(-50%,-50%)

//second flexbox
	display: flex
	align-items: center

//third with table (someone said the safest method)
.top
	display: table
	height: 100%
	margin: 0 auto
	position: relative
	z-index: 10
	color: red
.tbl-cell
	display: table-cell
	vertical-align: middle


	justify-content: center
	height: 100%