JSFiddle - React, Tailwind, and code Playground

by netsi1964

HTML

<div class="container">
<div class="scalable">
Hover to<br />
scale    
</div>
</div>
<pre>
.container {
    width: 100px;
    height: 100px;
    border: solid 1px black;
    overflow: hidden;
    margin: 2em;
    padding: .2em;
}

.scalable:hover {
    -webkit-transform: scale(1.7);
    -moz-transform: scale(1.7);
    -o-transform: scale(1.7);
    -ms-transform: scale(1.7);
    transform: scale(1.7);
    padding: 30px;
}
</pre>

CSS

.container {
    width: 100px;
    height: 100px;
    border: solid 1px black;
    overflow: hidden;
    margin: 2em;
    padding: .2em;
}

.scalable:hover {
    -webkit-transform: scale(1.7);
    -moz-transform: scale(1.7);
    -o-transform: scale(1.7);
    -ms-transform: scale(1.7);
    transform: scale(1.7);
    padding: 30px;
}