JSFiddle - React, Tailwind, and code Playground
HTML
<div class="cta black">
<h3 class="uppercase center black">
<a href="" class="white">test</a>
</h3>
</div>
CSS
.cta {
margin:20px auto 40px auto;
width:44.6%;
-webkit-transition:all 0.5s ease-out;
-moz-transition:all 0.5s ease-out;
-ms-transition:all 0.5s ease-out;
-o-transition:all 0.5s ease-out;
transition:all 0.5s ease-out;
}
.white {
color:white;
}
.black {
background-color:black;
}
.cta h3 a {
display:block !important;
padding: 10px 0;
}
.cta:hover {
-webkit-transform:scale(1.05,1.05);
-moz-transform:scale(1.05,1.05);
-ms-transform:scale(1.05,1.05);
-o-transform:scale(1.05,1.05);
transform:scale(1.05,1.05);
}