Flexbox:屏幕中间的居中元素

如果我要使用flexbox在屏幕中间放置一个元素,这个代码最优雅吗？

http://codepen.io/vennsoh/pen/wEAmz

HTML

CSS

body{
  overflow: hidden;
  position: absolute;
  width: 100%;
  height: 100%;
  display: flex;
}

.btn{
  width: 10rem;
  height: 10rem;
  background-color: #033649;
  margin: auto;
}

似乎我必须使用position:absolute和height + weight 100%来实现这一点.