JSFiddle - React, Tailwind, and code Playground

HTML

<div class="wrapper">txt<img src="http://dummyimage.com/300x100/08c/fff&text=initial"></div>
<div class="wrapper fix1">txt<img src="http://dummyimage.com/300x100/08c/fff&text=display:block"></div>
<div class="wrapper fix2">txt<img src="http://dummyimage.com/300x100/08c/fff&text=vertical-align:bottom"></div>
<div class="wrapper fix3">txt<img src="http://dummyimage.com/300x100/08c/fff&text=line-height:0"></div>

CSS

.wrapper {
    width: 300px;
    margin: 10px;
    border: solid tomato;
}

.fix1 img {
    display: block;
}

.fix2 img {
    vertical-align: bottom;
}

.fix3 {
    line-height: 0;
}