JSFiddle - React, Tailwind, and code Playground

by swarnendu

HTML

<div id="content">
    <div id="element"></div>
</div>

CSS

body {
    -webkit-perspective: 500;
}
#content {
    position:absolute;
    top: 0px;
    left: 0px;
    width: 300px; 
    height: 500px;
    background: #000;
    -webkit-transform-origin: 0px 0px;
    -webkit-transform: rotate(45deg);
    -moz-transform-origin: 0px 0px;
    -moz-transform: rotate(45deg);
}
#element {
    position:absolute;
    top: 0px;
    left: 0px;
    width: 50px; 
    height: 50px;
    background: #f00;
    -webkit-transform-origin: 0px 0px;
    -webkit-transform: rotate(-45deg);
    -moz-transform-origin: 0px 0px;
    -moz-transform: rotate(-45deg);
}