JSFiddle - React, Tailwind, and code Playground

HTML

<div class="col-3">
               <div class="popular"> <a href="#" ><img src="http://s10.postimg.org/4zqkz9rxl/saina_2.png"/></a></div>


	</div>

CSS

div.col-3 {
    -webkit-column-count: 3;
    -webkit-column-gap: 10px;
    -moz-column-count: 3;
    -moz-column-gap: 10px;
    column-count:3;
    column-gap:10px;
    margin:20px 30px;
    
}
.popular{
    overflow:hidden;
}
.popular:hover  {

background:#FF1493;
}
.popular:hover img {
opacity:0.7;

}