JSFiddle - React, Tailwind, and code Playground

by curiohub

HTML

<div id="stack1"></div>
<div id="stack2"></div>

CSS

body{
    
    background:#498AF4;
}

#stack1,#stack2{
                        display: block;
                        width: 180px;
                        height: 200px;
                        border: 10px solid #fff;
                        box-shadow:0px 0px 10px #000;
                        position: relative;
                        background: #000;
                        float: left;
                        margin-top: 50px;
                        margin-left: 50px;
                    }
                    /* for type 1 stacking*/
                    #stack1:before,#stack1:after{
                        z-index:-1;
                        display: block;
                        position: absolute;
                        width: 100%;
                        height:100%;
                        background: #FFF;
                        content: "";
                        border: 10px solid #fff;
                        padding: 0px;
                        margin: 0px;
                        top: -10px;
                       left: -8px;
                       
                       box-shadow:0px 0px 10px #000;
                       -webkit-box-shadow:0px 0px 10px #000;
                    }
                    #stack1:before{
                         -moz-transform:rotate(4deg);
                         -webkit-transform:rotate(4deg);
                    }
                    #stack1:after{
                        z-index:-2;
                         -moz-transform:rotate(8deg);
                         -webkit-transform:rotate(8deg);
                    }
                    /* for type 2 stacking*/
                    #stack2:before,#stack2:after{
                        z-index:-1;
                        display: block;
                        position: absolute;
                        width: 100%;
                        height:100%;
                        background: #FFF;
                        content: "";
                       ...