JSFiddle - React, Tailwind, and code Playground

by Yan F

HTML

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>JS Bin</title>
</head>
<body>
  Lorem ipsum dolor sit amet, consectetur adipisicing elit. Vero porro fugit ea doloribus sed nisi ratione officiis! Eius autem dolorum quasi quidem minus odio saepe consequatur suscipit perspiciatis atque asperiores!
<div class="grandpa"> Grandpa 
  <div class="dad"> Dad    
    <div class="son"> Son </div>
  </div>
</div>
</body>
</html>

CSS

.grandpa {
  margin-top: 20px;
  background-color: gold;
  position: relative;
  height: 500px;
  
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
}

.dad {
  background-color: darkcyan;
  width: 250px;
  height: 250px;
  
  position: absolute;
  bottom: 4em;
  left: 4em;
}

.son {
  background-color: hotpink;
  position: fixed;
  
  width: 100px;
  height: 100px;
  top: 2em;
  right: 2em;
}