JSFiddle - React, Tailwind, and code Playground

HTML

<body>
<div class="tablaBuscador">
    <div class="tablaBuscadorElementos" id="tablaBuscadorElementosUbicacion">
        <img src="http://blogs.westword.com/latestword/facebook.icon.205x205.jpg"></img>
        <span>1</span>
        </div>
    <div class="tablaBuscadorElementos" id="tablaBuscadorElementosTarjetas">
        <span>2</span>
        </div>
    <div class="tablaBuscadorElementos" id="tablaBuscadorElementosRubro">
        <span>3</span>
        </div>
    <div class="tablaBuscadorElementos" id="tablaBuscadorElementosDistancia">
        <span>4</span>
        </div>
</div>
</body>

CSS

body {
    height:100%;
    width:100%;
    margin:0px;
}
.tablaBuscador {
    font-family: "Maven Pro", sans-serif;
    margin:0px;
    padding:0px;
    text-align:left;
    vertical-align:middle; 
    height:200px;
    width:40%;
}

.tablaBuscadorElementos {
    height:22%;
    border: 1px solid black;
    padding:0px;
    width:100%;
}
.tablaBuscadorElementos > span {
    font-size:20px;
    width:80%;
    vertical-align:middle; 
    border:1px solid black;
    display:inline-block;
}
.tablaBuscadorElementos > img {
    vertical-align:middle; 
    width: 20px;
    height:20px;
    
}

.tablaBuscador, .tablaBuscadorElementos{
    display:block;
}
.tablaBuscadorElementos:before {
    content:'';
    height:100%;
    display:inline-block;
    vertical-align:middle;
}