JSFiddle - React, Tailwind, and code Playground

HTML

<div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
</div>
<div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
</div>
<div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
</div>

CSS

div>div{
    float:left;
    position:relative;
    width:100px;
    height:140px;
    border:1px dotted #000;
    border-top:none;
    border-left:none;
}
div>div:last-child{
    border-right:none;
}
div:last-child>div{
    border-bottom:none;
}
div>div:after{
    content:"";
    display:block;
    width:20px;
    height:20px;
    position:absolute;
    top:100%;
    left:100%;
    margin:-10px 0 0 -10px;
    z-index:1;
    background:#fff;
}