Flexboxで上下左右の中央揃えする方法

Flexboxで要素を中央揃えする方法です。
親要素に対して、display:flex;を指定し、justify-content:center;で上下の中央揃えをします。
そして、align-items:center;で左右の中央揃えをすると上下左右の中央揃えができます。

style.css

.center {
 height:120px;
 display:flex;
 justify-content:center;
 align-items:center;
}