【HTML】要素を画面の中央に表示する #HTML

よく忘れがちなのでメモメモ・・・

要素を水平に中央に表示するには、text-aling: centerがあるけど、垂直ってなるとなかなかこれといった方法がないですよねー。
今回、メモするのはいろいろと方法がある中ですごくシンプルな方法です。

<!DOCTYPE html>
<html>
<head>
<style type="text/css">
html, body {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
}
html {
  display: table;
}
body {
  display: table-cell;
  text-align: center;
  vertical-align: middle;
}
</style>
</head>
<body>
<div>
<p>中央？</p>
</div>
</body>
</html>