JSFiddle - React, Tailwind, and code Playground

by kizu

HTML

<div class="greenbox">
                        
    <a href="link"><span class="wrap1"><span class="wrap2">The Title Goes Here, with overflow</span></span></a>
                            
</div>

CSS

.greenbox { width:500px; height:200px; background:green; position:relative;}
.greenbox a {position:absolute; left:0; bottom:60px; font-size:50px;border-left:10px solid #000; }
.greenbox .wrap1 { position: relative; left:10px; background:#000; }
.greenbox .wrap2 { position: relative; left:-10px; background:#000; }