JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container position margin">
    <img src="https://addons.cdn.mozilla.net/img/uploads/addon_icons/354/354399-64.png?modified=1351203426" alt="img" />
</div>
<div class="margin">
    <div class="container table">
        <img src="https://addons.cdn.mozilla.net/img/uploads/addon_icons/354/354399-64.png?modified=1351203426" alt="img" />
    </div>
</div>

CSS

img {
    width: 64px;
    height: 64px;
    /*display: block;*/
}

.container {
    width: 100px;
    height: 100px;
    background: green;
}
.margin {
    margin: 10px;
}
.position {
    position:relative;
}
.position img {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}

.table {
    display: table-cell;
    vertical-align: middle;
}
.table img {
    display: block;
    margin-left: auto;
    margin-right: auto;
    vertical-align: middle;
}