HTML img 태그가 margin-top 속성으로 끝까지 올리가지 않는 이유

결론부터 말 하자면 오류는 아니고, 개발자의 무지에 의한 착각이다.

img 태그가 이미지를 표시하면 부피가 있어서 {display: "block"}이라고 착각할 수 있는데,
대부분의 브라우저에서는 {display: "inline-block"}을 기본값으로 가진다.

그래서 margin-top 값에 마이너스 값을 아무리 많이 주어도 라인 하나 정도의 간격을 넘어가지 못하는 것이다.

해결 방법은 {display: "block"}으로 스타일 값을 재정의 해주면 된다.

이제 원하는 만큼 margin-top 값에 마이너스 값을 사용하여 위로 이미지를 올릴 수 있다.


**원인을 찾다가 이에 대한 스택오버플로우 질문을 발견하여 이 글을 작성한다.**