Untitled

<!doctype html>
<html lang="pt-BR">
	<head>
		<meta charset="utf-8" />
		<title>align center with table-container</title>
		<style>
			body{
				margin: 0;
				padding: 0;
				border: 0;
			}
			div.box{
				height: 500px;
				width: 500px;
				background: red;
			}
			.box-inner{
				height: 100px;
				width: 100px;
				background: yellow;
				margin: 0 auto;
			}

			.table-container{
				display: table;
				height: 100%;
			}
			.table-cell{
				display: table-cell;
				text-align: center;
				vertical-align: middle;
			}
			div.align-center{
				margin-left: auto;
				margin-right: auto;
			}
		</style>
	</head>
	<body>
		<div class="box table-container">
			<div class="table-cell">
				<div class="box-inner">
					<div class="table-container align-center">
						<div class="table-cell">
							<div class="align-center">
								A
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</body>
</html>