[CSS] overflow

- overflow-x, overflow-y의 속기 속성

- 요소의 콘텐츠가 커서 블록 서식 컨텍스트에 맞지 않을 때 양방향으로 설정된다.

---

값

키워드: visible(기본값), hidden, scroll, auto

[값이 하나일 경우]

overflow-x와 overflow-y가 동일한 값으로 설정된다.

 

[값이 두개일 경우]

첫 번째 키워드는 overflow-x에 적용, 두 번째 키워드는 overflow-y에 적용된다.

---

설명

- visible(기본값) 이외의 값을 지정하면 새 블록 형식 컨텍스트가 작성된다.

- overflow를 사용하려면 블록 수준 컨테이너여야 한다.

- 설정된 높이가 height 또는 max-height가 있어야 한다.

- white-space가 nowrap으로 설정되어 있어야한다. (높이 설정이 되어 있는 않은 경우)

- 한 축을 visible(기본값)로 설정하고 다른 축을 다른 값으로 설정하면 visible은 auto로 작동한다.

---

[공부 좌표]

developer.mozilla.org/en-US/docs/Web/CSS/overflow