JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container">
    <div class="wrap">
        <div class="dummy"></div> 
        <a href="#" class="facebook"></a>
    </div>
    <div class="wrap">
        <div class="dummy"></div> 
        <a href="#" class="info"></a>
    </div>
    <div class="wrap">
        <div class="dummy"></div> 
        <a href="#" class="contacto"></a>
    </div>
    <div class="wrap">
        <div class="dummy"></div> 
        <a href="#" class="telefono"></a>
    </div>
    <div class="wrap">
        <div class="dummy"></div> 
        <a href="#" class="galeria"></a>
    </div>
</div>

CSS

.container {
    height:90%;
    position:fixed;
    top:5%;
    left:5%;
    width:100%;
}
.container .wrap {
    
    position: relative; 
    height: 18.4%;
    margin-bottom: 2%;
    width:100%;
    
}
.container .dummy {
    margin-right: 100%;
}
.container a {
    display:block;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: blue;
}
.container>div:last-child {
    margin-bottom: 0;
}