JSFiddle - React, Tailwind, and code Playground

HTML

<div class="iconcontainer">
<div class="icon kantoor">

<a href="http://www.albushosting.nl/wordpress08/kantoorartikelen/">.</a>
<h2>Kantoorartikelen</h2>
</div>
<div class="icon machines">

<a href="http://www.albushosting.nl/wordpress08/kantoormachines/">.</a>
<h2>Kantoormachines</h2>
</div>
<div class="icon facilitair">

<a href="http://www.albushosting.nl/wordpress08/facilitaire-producten/">.</a>
<h2>Facilitair</h2>
</div>
<div class="icon meubilair">

<a href="http://www.albushosting.nl/wordpress08/meubilair/">.</a>
<h2>Kantoormeubilair</h2>
</div>
<div class="icon relatie">

<a href="http://www.albushosting.nl/wordpress08/relatiegeschenken/">.</a>
<h2>Relatiegeschenken</h2>
</div>
<div class="icon drukwerk">

<a href="http://www.albushosting.nl/wordpress08/drukwerk/">.</a>
<h2>Drukwerk</h2>
</div>
</div>

CSS

.iconcontainer{
    text-align:center;
     border:1px solid #666;
  margin-top: 5em; 
/*  position: absolute; 
  left: 0;
  right: 0;*/
  
}

.icon {
    display:inline-block;
   border:1px solid #CCC; 
  margin-right: 2em;
  width: 7em;
}

.icon a {
  background: yellow;
  padding: 40px 43px 27px 40px;
/*  border: 1px solid red; */
  border-radius: 12px;
  border: 2px solid #777;
  color: transparent;

}

.icon h2 {
  margin-top: 35px;
  font-size: 16px;
  color: #1868AD;
}

.icon.kantoor {
  margin-right: 1em;
}

.kantoor a {
  background-image: url("http://www.albushosting.nl/wordpress08/wp-content/uploads/2016/02/books.jpg");
}

.kantoor a:hover {
  background-image: url("http://www.albushosting.nl/wordpress08/wp-content/uploads/2016/02/books-hover.jpg");
}

.machines a {
  background-image: url("http://www.albushosting.nl/wordpress08/wp-content/uploads/2016/02/printer.jpg");
}

.machines a:hover {
  background-image: url("http://www.albushosting.nl/wordpress08/wp-content/uploads/2016/02/printer-hover.jpg");
}

.facilitair a {
  background-image: url("http://www.albushosting.nl/wordpress08/wp-content/uploads/2016/02/coffee.jpg");
}

.facilitair a:hover {
  background-image: url("http://www.albushosting.nl/wordpress08/wp-content/uploads/2016/02/coffee-hover.jpg");
}

.meubilair a {
  background-image: url("http://www.albushosting.nl/wordpress08/wp-content/uploads/2016/02/chair.jpg");
}

.meubilair a:hover {
  background-image: url("http://www.albushosting.nl/wordpress08/wp-content/uploads/2016/02/chair-hover.jpg");
}

.relatie a {
  background-image: url("http://www.albushosting.nl/wordpress08/wp-content/uploads/2016/02/present.jpg");
}

.relatie a:hover {
  background-image: url("http://www.albushosting.nl/wordpress08/wp-content/uploads/2016/02/present-hover.jpg");
}

.drukwerk a {
  background-image: url("http://www.albushosting.nl/wordpress08/wp-content/uploads/2016/02/tools.jpg");
}

.drukwerk a:hover {
  background-image:...