#text {
  width: 400px;
  background: aqua;
  padding: 0px 50px 100px 200px;  /*top right bottom left*/
  margin: 0px 50px; /* first value applies to top and bottom, second applies to left and right, so putting 100px as first means 100px top and bottom. Not sure why the margin value for top, right, bottom, left is 8px all around in inspect element */
}

#colorblock {
  background: red;
  width: 100px;
  height: 100px;
  margin-top: 100px;
  margin-left: 800px;
}

span {
  background: yellow;
  /* display: block; */
}