JSFiddle - React, Tailwind, and code Playground

by niki4810

HTML

<div class="container">
    <div class="first-child"></div>
    <div class="next-child"></div>
    <div class="next-child"></div>
</div>

CSS

.container {
    position:relative;
    width:450px;
}

.next-child {
    position:absolute;
    border:1px solid #d8d8d8;
    height:100px;
    width:97.72727272727273%;
    margin : 0 0 0 10px;
    z-index:1;
    top:5px;
}
.first-child {
    position:absolute;
    z-index:2;
    border:1px solid #d8d8d8;
    height:90px;
    width:100%;
    background-color : #fff;
    padding:5px;
}
.first-child:after {
    content:"";
    position:absolute;
    bottom:5px;
    right:5px;
    width: 0px;
    height: 0px;
    border-style: solid;
    border-width: 0 0 12px 12px;
    border-color: transparent transparent #007bff transparent;
}

JavaScript

$(".first-child").click(function(e){

});