JSFiddle - React, Tailwind, and code Playground

HTML

<li class="user">
    <a href="#">
        <img class="img-circle online" src="http://placehold.it/50" />
        <span>Nome do Usuário</span>
    </a>
</li>
<li class="user">
    <a href="#">
        <img class="img-circle online" src="http://placehold.it/50" />
        <span>Nome do Usuário</span>
    </a>
</li>
<li class="user">
    <a href="#">
        <img class="img-circle online" src="http://placehold.it/50" />
        <span>Nome</span>
    </a>
</li>

CSS

.user {
    height: 50px;
    width: 120px;
    list-style:none;
    margin:1em 0;
}

.user a {
    display:table;
}

.user span {
    display: table-cell;
    vertical-align:middle;
}