将内容区域的样式设置成这样，可以解决，可是在编码的时候也会有很多问题。
.element { width: 60px; height: 40px; position: absolute; left: 0; top: 0; right: 0; bottom: 0; margin: auto; /* 有了这个就自动居中了 */ border:1px solid red; }
有其他的方法吗
走同样的路，发现不同的人生
首先get一个新方法；我一般这样居中.element {
width: 60px; height: 40px;position: absolute; left: 50%; top: 50%;transform:translate(-50%,-50%);border:1px solid red;}
你需要：CSS布局之-水平垂直居中
看这里 http://f2e.souche.com/blog/jie-du-cssbu-ju-zhi-shui-ping-chui-zhi-ju-zhong/
![[Web front-end] Démarrage rapide de Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
首先get一个新方法；
我一般这样居中
.element {
width: 60px; height: 40px;
position: absolute;
left: 50%;
top: 50%;
transform:translate(-50%,-50%);
border:1px solid red;
}
你需要：CSS布局之-水平垂直居中
看这里 http://f2e.souche.com/blog/jie-du-cssbu-ju-zhi-shui-ping-chui-zhi-ju-zhong/