console
<div class="container">
<div class="item">1</div>
<div class="item">2</div>
<div class="item">3</div>
<div class="item">4</div>
<div class="item">5</div>
</div>
.container {
width: 600px;
background: #fff;
di
.item {
width: 300px;
height: 200px;
border: 10px solid #fff;
background: grey;
float: left;
box-sizing: border-box;
color: #fff;
text-align: center;
display: flex;
justify-content: center;
align-items: center;
font-size: 26px;
&:hover {
height: 300px;
}
transition: all .5s;
}
}
.clearfix:after {
visibility: hidden;
display: block;
font-size: 0;
content: " ";
clear: both;
height: 0;
}