JSFiddle - React, Tailwind, and code Playground

by Tan

HTML

<div class="item">
<div class="img">image</div>
<div class="txt">
<h2>title</h2>
<p>text</p>
</div>
</div>

CSS

.item {max-width:300px;border:1px solid #dedede;position:relative;}
.img {width:300px;height:150px;background-color:#999999;}
.txt {position:absolute;display:block;padding:10px;}
.txt h2 {display:block;left:10px;right:10px;top:-10px;background-color:#cccccc;padding:0;margin:0;}
.txt p {margin:0;}