Margin Collapsing

블록 요소의 수직방향 마진이 서로 맞닿아 있다면 둘 중 큰 마진만 적용되는 현상

해결방법

• 부모요소에 overflow: hidden; 적용
• 자식요소에 display: inline-block; 적용
  CSS 마진 상쇄(Margin-collapsing) 원리 완벽 이해

Position

default 값은 static
relative는 본인이 원래 있어야 할 위치 기준이다.

position: relative;
left: 50px;

을 주면 static위치 기준 오른쪽으로 50px 이동.
absolute는 normal-flow를 벗어나서 static이었을 위치에서 붕 떠있는 느낌이다.
top, left로 위치를 이동시키면 position이 static이 아닌 부모 요소를 기준으로 이동한다.
부모 요소 중 relative가 없다면 body를 기준으로 한다.

제1회 자신만의 캐릭터 그리기 경진대회

운 좋게도 2등상을 수상했다