CodePen Embed - Center a div using CSS positioning

<html>
<body>
  <div class="parent">
    <div class="child"></div>
  </div>
    
</body>
</html>

* {
    margin: 0;
    padding: 0;
}

.parent {
  height: 100vh;
  width: 100%;
  background: #fe994a;
 
}

.child {
  height: 70px;
  width: 70px;
  background: #7BB274;
  
/*  centering the div  */
  position: absolute; 
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto; /* centers the div */

}

This Pen is owned by muzhda on CodePen.

See more by @muzhcode on CodePen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.