css-position-relative

by cangmean

HTML

<div class="gray">
  <div class="blue"></div>
  <div class="red"></div>
  <div class="yellow"></div>
</div>

SCSS

$width: 50px;
$height: 50px;

* {
  margin: 0;
  padding: 0;
}

.gray {
  width: $width * 4;
  height: $height * 4;
  background-color: gray;
}

.blue {
  width: $width;
  height: $height;
  background-color: blue;
}

.red {
  width: $width;
  height: $height;
  background-color: red;
  position: relative;
  left: 10px;
  top: 20px;
}

.yellow {
  width: $width;
  height: $height;
  background-color: yellow;
}