margin 자동으로 계산하기

그렇다면 margin에 "auto" 값을 주면 어떻게 될까요?

auto는 '여백을 자동으로 계산해준다'라는 의미입니다.

예를 들어 margin: auto;라고 설정하면 요소의 양 옆 마진을 자동으로 계산해 동일하게 설정하여, 요소를 가운데로 정렬할 수 있습니다. 이렇게 margin: auto;는 요소를 가운데 정렬할 때 자주 사용하는 CSS입니다.

참고로 내부 여백을 정하는 padding에는 auto 값을 부여할 수 없습니다. 즉 padding: auto;는 유효한 CSS가 아닙니다.

padding은 요소 내부 공간을 다루고, 그 내부 공간은 보통 요소의 크기나 내용에 따라 결정되기 때문입니다.