JSFiddle - React, Tailwind, and code Playground

by kodjoe mambi

HTML

<div class="textoverimage">

<img src="https://static.pexels.com/photos/129881/pexels-photo-129881.jpeg" alt=""/>

<div class="text">TOM HOOPS</div>

</div>

CSS

.text { position: absolute; top: 20px; left: 20px; width: 100%; color: white;
         text-shadow: 0px 0px 2px #282828 }

JavaScript

$(function() {
$(".textoverimage .text")
.wrapInner("<span>")

$(".text br")
.before("<span class='spacer'>")
.after("<span class='spacer'>");

});