HTML, CSS hover on image

http://stackoverflow.com/questions/24829785/html-css-hover-on-image/24830215

HTML

<div class="photo">
                	<img src="http://placekitten.com/400/300" alt="image"/>
                    <div class="zoom">
                    Info
                    </div>
                    <div class="all">
                    </div>
                    <div class="link">
                    </div>
                    <div class="info">
                    This is an info
                    </div>
                    <div class="like">
                    </div>
                </div>

CSS

.photo {
    float:left;
    position:relative;
}

.photo img {
	float:left;
	width:auto;
	height:auto;
}

.photo:hover {
	display: block;
	opacity:0.6;
}
.photo:hover .zoom {
	position: absolute;
	background-image:url(http://www.kolazhgostar.com/images/small-img05.png);
	background-repeat:no-repeat;
	width:46px;
	height:50px;
	background-position:center;
    
    left:50%;
    top:50%;
}