마진상쇄
-
마진 상쇄 - CSS코드잇 2023. 11. 22. 19:11
마진 상쇄(margin Collapsing)는 html 태그끼리 세로 마진을 겹쳐서 더 큰 마진을 적용한다. 가로 마진은 겹치지 않는다. 위 아래 겹치는 태그는 마진 상쇄가 일어난다. 부모와 자식간의 태그인 경우 border나 padding이 있으면 마진 상쇄되지 않는다. - 위 아래 겹치는 태그 a b 세로로 연달아 있는 태그들이다. 이 둘의 마진을 겹치면 40px이 된다. - 부모 자식간에 margin만 있는 경우 (상쇄 됨) b d - 부모 자식간에 border가 있는 경우 (상쇄 안됨) b d border 테두리에 막혀서 margin 끼리 상쇄가 되지 않는다.