JSFiddle - React, Tailwind, and code Playground

HTML

<table class="table">       
    <tr width="25%" >
        <td width="25%" valign="top">
            <a class="button1" href="#"onclick="Application"><span>App</span></a>
            <a class="button2" href="#"onclick="Application"><span>Application</span></a> 
            <a class="button2" href="#"onclick="Application"><span>Application</span></a> 
            <a class="button2" href="#"onclick="Application"><span>Application</span></a> 
            <a class="button2" href="#"onclick="Application"><span>Application</span></a> 
            <a class="button1" href="#"onclick="Application"><span>Application</span></a> 
            <a class="button2" href="#"onclick="Application"><span>Application</span></a> 
            <a class="button1" href="#"onclick="Application"><span>Application</span></a> 
            <a class="button1" href="#"onclick="Application"><span>Application</span></a> 
            <a class="button2" href="#"onclick="Application"><span>Application</span></a> 
            <a class="button2" href="#"onclick="Application"><span>Application</span></a> 
            <a class="button2" href="#"onclick="Application"><span>Application</span></a> 
            <a class="button1" href="#"onclick="Application"><span>Application</span></a>
            <a class="button2" href="#"onclick="Application"><span>Application</span></a>           
            <a class="button1" href="#"onclick="Application"><span>Application</span></a>
            <a class="button1" href="#"onclick="Application"><span>Application</span></a>
            <a class="button1" href="#"onclick="Application"><span>Application</span></a>
            <a class="button1" href="#"onclick="Application"><span>Application</span></a>
            <a class="button1" href="#"onclick="Application"><span>Application</span></a>
            <a class="button2" href="#"onclick="Application"><span>Application</span></a>
            <a class="button2" href="#"onclick="Application"><span>Application</span></a>
    ...

CSS

a { display: inline-block; position: relative; }

.button1 {
    color: red;
    width:245px;
    height:25px;
    font-family: Tahoma;
    font-size: 12px;
    text-align:center;
    text-decoration: none;
    background-color: #E2E2E2;
    border-top: 2px solid #F1F1F1;
    border-right: 2px solid #969696;
    border-bottom: 2px solid #969696;
    border-left: 2px solid #F1F1F1;
    z-index: 1;
}
.button1:hover {
    -webkit-transform:scale(1.6);
    -moz-transform:scale(1.6);
    -ms-transform:scale(1.6);
    -o-transform:scale(1.6);
    transform:scale(1.6);
    z-index: 2;
}
.button2 {
    width:245px;
    height:25px;
    font-family: Tahoma;
    font-size: 12px;
    text-align:center;
    text-decoration: none;
    background-color: #E2E2E2;
    border-top: 2px solid #F1F1F1;
    border-right: 2px solid #969696;
    border-bottom: 2px solid #969696;
    border-left: 2px solid #F1F1F1;
    z-index: 1;
}
.button2:hover {
    -webkit-transform:scale(1.6);
    -moz-transform:scale(1.6);
    -ms-transform:scale(1.6);
    -o-transform:scale(1.6);
    transform:scale(1.6);
    z-index: 2;
}