사용자가 입력하는 유동적인 데이터 처리시 띄어 쓰기를 하지 않아서 의도하지 않게 텍스트가 밀려나온다던지, 의도하지 않는 크기 이상으로 부모 컨테이너가 밀려 나오는 경우가 있다.
IE에서는 word-wrap: break-word;이라는 CSS가 있어서 이전부터 사용해왔었고, 많은 곳에서 이것만을 사용하고 프로그램 로직에서 스페이스를 주는 트릭을 사용한다.
그러나 FireFox나 Opera에서도 이를 해결할 수 있는 방법이 있는데, white-space를 이용하여서 줄바꿈이 가능하도록 하는 구문이다.
#wordwrap{
white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
white-space: -pre-wrap; /* Opera 4-6 */
white-space: -o-pre-wrap; /* Opera 7 */
word-wrap: break-word; /* Internet Explorer 5.5+ */
}
