# 如何实现一个元素的水平垂直居中
Issue
欢迎在 Issue 中交流与讨论: Issue 10
Author
回答者: woohs
绝对定位方法：
.box {
postion: absolute;
top: 50%;
bottom: 50%;
width: 50px;
height: 50px;
transform: translate(-50%, -50%);
}
<body>
<div class="box"><div>
</body>
flex方法：
body {
display: flex;
justify-content: center;
align-items: center;
}
.box {
width: 50px;
height: 50px;
}
<body>
<div class="box"><div>
</body>
