브라우저 환경에서 UI 마크업을 하다 보면 가장 헷갈리는 지점 중 하나가 바로 줄바꿈이다. 언어 별로 줄바꿈이 동작하는 방식도 다르고, 공백 문자가 줄바꿈에 적용되게 하기 위한 방식도 가지각색이다. 줄바꿈에 대한 요구사항이 들어올 때마다 매번 대충 구글링해서 쓰던 white-space: pre 뭐시기 속성, word-break, 태그 등… 이번에는 과연 이 속성들이 어떻게 동작하는 것이고, 어떤 상황에서 어떤 줄바꿈 전략을 사용해야 하는지 알아보고자 한다. 줄바꿈을 적용하는 방법을 알아보기 위해, 먼저 줄바꿈에는 어떤 종류의 것들이 있고, User Agent에 의한 콘텐츠 래핑은 어떻게 발생하는지 짚고 넘어가보자. 줄바꿈은 어떻게 발생할까 인라인 성격의 텍스트가 줄로 배치되는 경우, 박스 영역을 기준으로..
