div의 이미지가있는 가운데 앵커

Question

앵커 요소에 이미지가 있습니다.

부모 div에서 앵커의 이미지를 세로 및 가로로 가운데에 맞 춥니 다.

Here의 예 :

<div class="wrapper"> 
    <a href="#" class="anchor"> 
     <img src="http://bit.ly/1mFH8AW"></img> 
    </a> 
</div> 
.wrapper { 
    background: black; 
    width: 500px; 
    height: 500px; 
} 
.anchor { 
} 
.anchor > img { 
    height: 100px; 
    width: 100px; 
} 

결과 :

Answer 1

래퍼에 position:relative를 추가 한 다음에 이미지의 CSS를 변경 :

.anchor > img { 
    height: 100px; 
    width: 100px; 
    position:absolute; 
    margin:auto; 
    top:0;right:0;bottom:0;left:0; 
} 

jsFiddle example