Html Padding 과 Margin 차이점

margin 과 paddign 의 큰 차이점은 외부와 내부의 여백을 나타낸다는 것입니다.

div라는 그룹 박스를 기준으로 외부의 여백을 계산하는 것이 margin 이고

내부의 여백을 계산하는 것이 paddign 입니다.

margin

padding

 margin 은 너비 50px 와 높이 50px 에서 margin을 주었을때 외부 여백으로 주어지므로

body에서 20px씩 떨어진 것을 확인할 수 있습니다.

아래 paddign 는 margin 과 마찬가지로 너비 50px, 높이 50px 를 주었지만,

안쪽으로 20px씩 여백을 주었으므로 더 사이즈가 늘어난 것을 볼 수 있습니다.

이와 같이 margin 과 padding 의 차이점을 볼 수 있습니다.