JSFiddle - React, Tailwind, and code Playground

HTML

<div class="wrapper">
    <img src="http://placehold.it/350x150"/>
    <p>My text, size unknowkn</p>
</div>

CSS

html, body { height: 100%; }

.wrapper { 
    height: 100%;
    width: 100%;
    position: relative;
}

img {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

p {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  margin: 0;
}