JSFiddle - React, Tailwind, and code Playground

HTML

<div>x<img src="http://placehold.it/150&text=baseline">y</div>
<div>x<img src="http://placehold.it/150&text=top" style="vertical-align: top;">y</div>
<div>x<img src="http://placehold.it/150&text=middle" style="vertical-align: middle;">y</div>
<div>x<img src="http://placehold.it/150&text=bottom" style="vertical-align: bottom;">y</div>
<div>x<img src="http://placehold.it/150&text=block" style="display: block;">y</div>

CSS

html, body {background: black}
img {width:150px;height:150px;}
div {outline: 1px solid red; background: yellow; margin: 5px;}