hover person with data

by vaheed akhtar

HTML

<div class="grow" style="background-color: #2a75a9;">
  <img src="http://icons.iconarchive.com/icons/graphicloads/100-flat/256/home-icon.png" style="height:30;width:30px;">
  <p>Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature</p>
</div>

CSS

.grow {
  padding: 5px 5px 5px 5px;
  border-radius: 10px;
  height: 49px;
  width: 145px;
  margin: 5px 1% 5px 1%;
  position: relative;
  transition: height 0.5s;
  -webkit-transition: height 0.5s;
  text-align: center;
  overflow: hidden;
}
.grow:hover {
  height: 155px;
    width: 145px;
    cursor:pointer;
}