https://teratail.com/questions/23597

<!DOCTYPE html>
<html>

  <head>
    <link rel="stylesheet" href="style.css">
    <script src="script.js"></script>
  </head>

  <body>
    <div id="div1">
      div1
      <div id="div2">
        div2
        <div id="div3">
          div3
        </div>
      </div>
    </div>
  </body>

</html>

// Code goes here

/* Styles go here */
body {
  margin-top: 50px;
}
div {
  border: 2px solid;
}
#div1{
  position: relative;
  background-color: red;
  width: 300px;
  height: 300px;
}
#div2{
}

#div3{
  position: absolute;
  top: 0;
  left: 10px;
  background-color: blue;
  width: 50px;
  height: 50px;
}