overflow

요소내의 컨텐츠가 너무 커서 요소내에 모두 보여주기 힘들 때 사용

(크기가 고정 될때 이용) 

 

1) overflow: visible;

- 기본 값

- 넘칠 경우 컨텐츠가 상자 밖으로 보여짐 

 

 

 

 

 

2) overflow: hidden;

- 넘친 컨텐츠가 잘라지고 보여지지 않음 

 

3) overflow: scroll;

- 넘친 콘텐츠는 잘리고 스크롤바가 생김 (가로/세로 둘다) 

 

4) overflow: auto;

- 넘칠 경우 스크롤바가 자동으로 생성(가로, 세로 필요한 부분에만 생김) 

5) overflow-x, overflow-y

 

- 가로 세로 각각 조절 

  overflow-y: hidden;

  overflow-x: scroll;