megwoo
6/24/2015 - 5:22 AM

CSS Centering Techniques

.absolute-center {
  position: absolute;				
	top: 50%;
	-ms-transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
	left:0;
	right:0;
	margin:0 auto;
	width: 85%;
	text-align: center;
}

<div class="table">
   <div class="center">
       Unknown stuff to be centered; cannot use floated divs in here, so use inline-block instead.
   </div>
</div>

.table {
   display: table;
   width: 100%;
}

.table .center {
   display: table-cell;
   text-align: center;
   vertical-align: middle;
}