JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://raw.github.com/LeaVerou/prefixfree/master/prefixfree.min.js"></script>
<div class="d1">
    <div class="d2">
        <div class="d3">
        </div> 
    </div> 
</div>

<div class="d1">
    <div class="d2 fixed">
        <div class="d3">
        </div> 
    </div> 
</div>

CSS

div {
    padding: 20px;
    border: 1px solid #fff;
    background: #ccc;
}
.d1 {
    width: 84px;
}

div:active {
     background: green;
}


.d2.fixed {
    position: relative;
}
.d2.fixed:after {
    content:"";
    position: absolute;
    top: -1px; right: -1px; bottom: -1px; left: -1px;
}