JSFiddle - React, Tailwind, and code Playground

HTML

<div class="wrapper">
  <div class="text-box">
    <p>lorem ipsum</p>
    <p>lorem ipsum</p>
  </div>
  <a href="https://placeholder.com"><img src="http://via.placeholder.com/770x690"></a>
</div>

CSS

.wrapper img  {
  position: absolute;
  left: 50%;
  top: 50%;
  width:100%;
  transform: translate(-50%, -50%);
  z-index: 0;
}

.text-box {
  z-index: 1;
  position: relative;
  top: 20px;
  left: 20px;
}