[css] margin과 padding 적재적소에 사용하는 법 (feat. margin-collapsing 마진병합현상/마진상쇄현상)

margin과 padding의 차이점? 아니, margin 과 padding 의 정확한 사용법! 어느덧 코딩한지 8개월차, (학원 다닌 기간 포함) 마진과 패딩의 차이점을 이론적으로는 충~분히 알고 있다. 그런데 실전에서 적용하려고 하니 그 사용 대상이 애매해지는 경우가 많았다. 생각하기에 따라 margin 과 padding을 적용하는 곳이 달라진다. 물론 이것 또한 일종의 방법론이긴 하나 적절하게 나누어서 사용하는 것이 제일이다. 예를 들면, B 박스 안에 A 박스가 있을 때, A 박스의 위치를 잡기 위해서는 어떻게 코딩하느냐. 나는 B 박스에 패딩을 줘서 A 박스의 영역을 잡곤 했는데, 물론 이것도 틀린 방법은 아니다. 박스를 어떻게 볼지 그 관점에 따라 달라지는 것인데, 아래의 그림을 참고하자. 다..

2021.07.20