글자수가 길때 줄바꿈이 안되는 경우

word-break 옵션을 추가한다.

- 텍스트가 들어가는 블록 요소에서 단어 단위로 줄 바꿈할지, 글자 단위로 줄바꿈 할지를 정하는 속성

 

1. word-break: normal

word-break의 기본값으로 한글은 글자 단위, 영어는 단어 단위로 줄바꿈 한다.

우측 공간이 듬성듬성 비게 될 가능성이 있다.

 

2. word-break: break-all;

한글, 영문 모두 글자 단위의 줄바꿈을 한다. 

반응형 웹을 고려할때 가로길에 맞게 줄바꿈이 되어 미관상 적합하다.

 

3. word-break: keep-all;

한글, 영어 모두 단어 기준으로 줄바꿈한다.