JSFiddle - React, Tailwind, and code Playground

HTML

<div class="cont2">
	<img src="http://www.vector-finder.com/site-images/too_big/fantasy_banner_vector.jpg" />
	<div class="text-wrap">
		<p>Some text here. Some text here. Some text here. Some text here. Some text here. Some text here. Some text here. Some text here. Some text here. Some text here. Some text here. Some text here. Some text here. Some text here. Some text here. Some text here. Some text here. </p>
	</div>
</div>

CSS

.cont2 {
	display: table;
	text-align: center;
	margin: auto;
}

.cont2 img {
	display: block;
	width: 100%;
}

.cont2 .text-wrap {
	display: table-caption;
	caption-side: bottom;
}