styles.css

html {
  background: #b3b3b3;
  padding: 15px;
  border: 5px solid white;
  margin: 15px;
  height: 2000px;
}

body {
  background: #fa923f;
  padding: 20px;
  border: 5px solid black;
  margin: 0;
  height: fit-content;
  /* overflow:hidden; CSS will automatically add this to HTML instead of body
  So will not work. Unless you specifically add to both HTML and body
   */
}

.parent {
  background: white;
  padding: 20px;
  border: 5px solid black;
  margin: 0;
  overflow: hidden;
}

.parent div {
  background: rgb(105, 105, 109);
  color: white;
  padding: 10px;
  border: 5px solid black;
  margin: 10px;
}

.parent .child-1 {
  position: relative;
  /* position context is element itself
     moved down 50 from top and 50 from left.
     Push from current position
   */
  top: 50px;
  left: 600px;
}