У меня проблема с моим наведением на img в моем #picutre div. HTML:

<div id="picture">
      <img class="content_pic" src="image/exemple.jpg" alt="exemple"/>
      <img class="content_pic" src="image/exemple.jpg" alt="exemple"/>
</div>

И мой CSS выглядит так:

#picture {
text-align:center;
}

#picture img {
width:40%;
height:40%;
border:1px solid #000000;
display:inline-block;
margin-left:0;
margin-right:0;
opacity:0.4;
}

.content_pic:hover{
opacity:1.0;
}

Так что мне интересно, почему это не работает. Я использую Google Chrome, тоже проверил IE10, но там тоже не работает.