display: flex
、便利なので何気なく使っている気がします。
人が組んでいるのをちょこちょこ触って気づきましたが、
Web サービスの UI の位置をセンタリングする場合、
align-items: center
justify-content: center
でセンタリングするより、
内部要素に margin: auto
を当てた方が使い勝手が良いです。
flex 系のプロパティでセンタリングした物は、
画面サイズを小さくしたり要素を大きくして見切れるようにすると、
上側と左側へのスクロールができなくなります。
内部でスクロール出来るか出来ないかだけの違いですが、
何気にウィンドウ系な UI を配置する場合、表示する術が無いと辛いケースが。
flex のプロパティを使いこなせば普通に回避できそうな気もしますが、
割とシンプルに回避できるので margin: auto
がお勧めです。
[追記:2018年8月30日]
IE で margin: auto
でのセンタリングが効かない様なので、
IE 対応が必要な物には利用しないほうが良いです。
[追記:2019年1月1日]
IE でも効いたので何かの勘違いだった?模様。
効かなかった気がするのだけど。。