white-space

white-space 속성이 뭔줄 알아요?

CSS white-space 속성은 요소가 공백 문자를 처리하는 법을 지정합니다.

값

• normal
  연속 공백을 하나로 합침, 개행 문자도 다른 공백 문자와 동일하게 처리, 한줄이 너무 길어서 넘칠 경우 자동으로 줄 바꿈

• nowrap
  연속 공백을 하나로 합침, 줄 바꿈은 <br>요소에서만 일어남

• pre
  연속 공백 유지. 줄 바꿈은 개행 문자와 <br>요소에서만 일어남

• pre-wrap
  연속 공백 유지. 줄 바꿈은 개행 문자와 <br>요소에서 일어나며, 한 줄이 너무 길어서 넘칠 경우 자동으로 줄을 바꿈

• break-spaces
  다음 차이점을 제외하면 pre-wrap과 동일

  - 연속 공백이 줄의 끝에 위치하더라도 공간 차지
  - 연속 공백의 중간과 끝에서도 자동 줄 바꿈 가능
  - 유지한 연속 공백은 `pre-wrap`과 달리 요소 
  바깥으로 넘치지 않으며 공간도 차지하므로 박스의 본질크기에 영향을 줌
  
  [출처](https://developer.mozilla.org/ko/docs/Web/CSS/white-space)