앵커 내 이미지 (img) (a)가 올바르게 렌더링되지 않음

Question

안녕하세요, 저는 잘못된 일을 이해하고 있습니다. 두 가지 요소가 있습니다. 스타일이없는 앵커 이미지가 있습니다. 앵커가 이미지 영역을 덮지 않는 방법.

예 : http://jsfiddle.net/L4ShV/1/

<a href="javascript:void(0)" id="downloadLink" > 
    <img src="http://toonimo.com/testing/clients_tests/somoto/flv_player/images/nlp/free_download_btn.jpg" border="0" style="width: 373px;height: 120px;" /> 
</a> 
<div> 
    <h1>a dimantions:</h1> 
    width: <span id='width_c'></span><br> 
    height: <span id='height_c'></span><br> 
    <br> 
     when clearly its not possible! 
     How can i get the Real height? 
</div> 

<script> 
    var el = document.getElementById('downloadLink'); 
    document.getElementById('width_c').innerHTML = el.offsetWidth; 
    document.getElementById('height_c').innerHTML = el.offsetHeight; 
</script> 

이 문제에 대한 어떠한 이유로 또는 솔루션?

Answer 1

블록 레벨 요소를 예상 할 때 정상적인 앵커 동작입니다. 이미지를 덮기 위해 a를 부유시킬 수 있습니다.

<a href="javascript:void(0)" id="downloadLink" style="float:left">