Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | ||
6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 | 22 | 23 | 24 | 25 | 26 |
27 | 28 | 29 | 30 |
Tags
- vscode
- 브루트포스
- 누적합
- 이벤트 생명주기
- react18
- BFS
- 재귀
- 렌더링 최적화
- next14
- webpack5
- 두 포인터
- 이분탐색
- webpack
- 구현
- 마진 상쇄
- 정적타입언어
- 레퍼런스복사
- 즉시실행함수
- 백준
- 동적타입언어
- 슬라이딩 윈도우
- react
- SW EA
- 공백찾기
- 레이아웃 스래싱
- 리액트
- 컴포넌트 생명주기
- 값복사
- 분할정복
- 수학
Archives
- Today
- Total
목록마진 상쇄 (1)
D.JOUNG
[html, css] margin 영역끼리 겹치는 마진 상쇄 해결
html 구조가 복잡해지다보면 marin 영역끼리 겹치는 마진 상쇄 현상과 심심찮게 마주한다. 마진 상쇄가 발생하는 경우는 대략 다음과 같다.1. 형제 노드끼리 맞닿는 영역에 각자 마진영역이 설정되어있을 경우 (더 넓은 쪽이 작은 쪽을 상쇄한다.)2. 부모 요소의 상단 마진 과 자식 요소의 상단 마진이 맞닿았을 경우 (부모 요소의 마진만 적용되고, 자식 요소의 마진은 상쇄된다.) - 개인적으로 가장 짜증난다. chat-gpt한테 물어보면 몇가지 경우 더 있지만, 난 주로 위 두 가지 경우를 많이 마주쳤다. 짜증나긴 하지만 오류는 아니라고 하고, 브라우저가 레이아웃을 더 깔끔하게 관리하기 위한 규칙이라는 모양이다. 마진 상쇄는 블록 요소에서만 발생하기 때문에, 요소를 인라인 속성(inline, inline..
토막 지식
2024. 6. 6. 21:09