JSFiddle - React, Tailwind, and code Playground

HTML

<div class="cuerpo">
    <div class="articulosysidebar">
    <!--articulos-->
    <div class="articulos"></div>
  <!--sidebar-->
    <div class="sidebar"></div>
  </div>
<!--botones redes sociales-->
<div class="social">
    <a class="twitter" href="https://twitter.com/franlegon">Twitter</a>
    <a class="facebook" href="https://www.facebook.com/franlegon">Facebook</a>
    <a class="pinterest" href="http://www.pinterest.com/franlegon/">Pinterest</a> 
</div>
</div>

CSS

body{height:2000px}
/**/
.social {
    height:100%;
    width: 4.7%;
}
.social a {
  /* height: 3vw; */            /*HERE I WANT NOTHING*/
  width: 100%;            /*HERE I WANT 100%*/
  float:right;
  display: block;
  text-indent: -9999px;
}

.twitter {background-image: url(http://ow.ly/IPVSe);}
.facebook {background-image: url(http://ow.ly/IPVWg);}
.pinterest {background-image: url(http://ow.ly/IPVGB);}

/**/
.cuerpo {
    width:100%;
    height:100%
}

.articulosysidebar {
    width:91%;
    height:100%;
    background:#DEDEEC;
    margin-right:4%;
    float:right;
}

/**/
.articulos {
    width: 74%;
    height:100%;
    float: left;
}

/**/
.sidebar {
    background: #165eac;
    float:right;
    width: 25%;
    height:100%;
    
}