CodePen Embed - Centering 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: #555c63;
}

.child {
  height: 60px;
  width: 60px;
  background: #96ffb2;

/*  Centering div using CSS positioning  */
  position:absolute; 
  top: 50%; 
  left: 50%;
  transform: translate(-50%, -50%);
}

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.