发布于 4年前

CSS让绝对定位的元素居中的办法

水平居中，设置left:0,right:0，垂直居中，设置top:0,bottom:0。margin设置为auto


<html lang="en">
<head>
  <title>SO question 2803532</title>
  <style type="text/css">
    .absolute-center {
      position: absolute;
      width: 100px;
      height: 100px;
      margin: auto;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      background: red;
    }
  </style>
</head>
<body>
    <div class="absolute-center"></div>
</body>
</html>

</body></html>