JSFiddle - React, Tailwind, and code Playground
HTML
<div class="containers">
<p>hello</p>
</div>
<div class="containers transformed">
<p>hello</p>
</div>
<div class="containers">
<p>hello</p>
</div>
CSS
.containers {
display: inline-block;
margin-right: 1em;
width: 5em;
height: 5em;
border-radius: 1em;
background-color: #1a1a1a;
padding: 1em;
}
.containers p {
color: white;
}
.transformed {
-webkit-transform: scale(1);
-moz-transform: scale(1);
-o-transform: scale(1);
background-color: orange;
}
.transformed:hover {
-webkit-transform: scale(2);
-moz-transform: scale(2);
-o-transform: scale(2);
}