JSFiddle - React, Tailwind, and code Playground

HTML

<a href="#" class="top-link">
<a href="/" class="sub-link1">clickable</a>
<a href="/" class="sub-link2">clickable</a>
<a href="/" class="sub-link3">clickable</a>
</a>

CSS

.top-link {
    background:#333;
    display:block;
    position:relative;
    z-index:1;
    width:500px;
    height:500px;
}
.sub-link1 {
    background:#666;
    display:block;
    position:absolute;
    bottom:5px;
    z-index:3;
    width:100px;
    height:100px;
    float:left
}
.sub-link2 {
    background:#666;
    display:block;
    position:absolute;
    bottom:5px;
    left:200px;
    z-index:3;
    width:100px;
    height:100px;
    float:left
}
.sub-link3 {
    background:#666;
    display:block;
    position:absolute;
    bottom:5px;
    left:340px;
    z-index:3;
    width:100px;
    height:100px;
    float:left
}