CodePen

HTML

            
              <div class="container">
  <div class="box box1"></div>
  <div class="box box2"></div>
  <div class="box box3"></div>
  <div class="text">Hurray!</div>
</div>
            
          
!

CSS

            
              .container {
  margin: 20px auto;
  position: relative;
  width: 200px;
  height: 200px;
}
.box {
  position: absolute;
  top: 50px;
  left: 50px; 
  width: 100px;
  height: 100px;
  background-color: yellow;
}
.box2 {
  transform:rotate(30deg);
}
.box3 {
  transform:rotate(60deg);
}
.text {
  position:absolute;
  top:75px;
  left:30px;
  color:#3366ff;
  font-size:40px;
  font-weight: bold;
  font-family: arial;
  transform:rotate(-10deg);
  text-shadow: 3px 3px 5px gray;
}
            
          
!
? ?
? ?
Must be a valid URL.
+ add another resource
via CSS Lint

JS

            
              
            
          
!
Must be a valid URL.
+ add another resource
via JS Hint
Loading ..................