[Solved] Issues in image opacity in hover state


Check this:

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;
}

Fiddle Demo

4

solved Issues in image opacity in hover state