.png)
앞서 배운 테두리박스와 패딩만 쓰면 모든 화면 CSS가 가능할까요?
결론부터 말씀드리면, 아닙니다.
마진(margin) 이라는 속성도 필요합니다. 마진 상쇄(margin collapse) 라는 개념에 대해 알아보겠습니다.
마진 상쇄란, CSS에서 블록 요소 간의 마진이 겹치는 현상입니다. 두 개의 블록 요소가 서로 접해 있을 때, 각각의 마진이 합쳐지지 않고, 더 큰 마진값만 적용되는 현상을 의미 합니다.
마진 상쇄가 없다면, 각 요소의 마진이 개별적으로 적용되어 두 요소 사이의 간격이 더 넓어질 것입니다. 즉, 인접한 두 블록 요소의 마진이 겹치지 않고 각각의 마진이 모두 더해져서 적용되는 형태가 됩니다.
❗️ 심화 학습 주제!
마진 상쇄 예외 상황 특정 상황에서는 마진 상쇄가 발생하지 않습니다. 하단의 문서를 참고하셔서 공부해보세요!