<div class="block"></div>
html,
body {
height: 100px;
width: 300px;
}
body {
display: flex;
justify-content: center;
align-items: center;
}
.block{
width:50px;
height:50px;
background:red;
transform: scale(1,1);
transition-timing-function: ease-out;
transition-duration: 550ms;
transform: scale(1,1);
transition-timing-function: ease-out;
transition-duration: 550ms;
}
.block:hover {
transform: scale(2,2);
transition-timing-function: ease-out;
transition-duration: 550ms;
transform: scale(2,2);
transition-timing-function: ease-out;
transition-duration: 550ms;
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.