JSFiddle - React, Tailwind, and code Playground

by IllusionMH

HTML

<div class="parent">
    <div class="child" id="ch1"></div>
</div>
<div class="parent">
    <div class="child" id="ch2"></div>
</div>

CSS

.parent {
    width: 200px;
    height: 100px;
    padding: 20px;
    border: 1px solid black;
    margin: 10px;
}
.child {
    width: 100%;
    height: 50px;
    border: 1px solid gray;
    position: relative;
}
.child:before {
    display: block;
    content: "Content here"; 
    position: relative;
    border: 1px solid red;
    height: 100%;
    width: 100%;
    left: -1px;
    top: -1px;
}
#ch2 {
    padding: 20px;
}
/*#ch2:before {
    margin: -20px;
}*/