textarea글씨 넘어갈 때 막기 textarea / pre

<td colspan="3" style="width: 750px; height:300px; vertical-align:top; " >
    <pre style=" white-space: pre-wrap;">${resultBoard.content}</pre>                                        
</td>

이렇게 pre 라는 태그를 넣으면 된다.

그런데, pre 태그도 못막는게 엔터 없이 쭉 입력한 데이터이다.

그래서....

style=" white-space: pre-wrap;"     을 pre 태그에 넣으면 알아서 줄바꿔 출력해준다.

하지만, 익스에서는 적용이 되지 않는다....

{
white-space: pre-wrap; /* CSS3*/
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-all; /* Internet Explorer 5.5+ */ 

}

이렇게 추가를 하면 대부분의 브라우저에서 줄바꿈 지원이 된다

완성코드....

<td colspan="3"  style="width: 750px; height:300px; vertical-align:top; " >
      <pre class="content" >${resultBoard.content}</pre>
</td>
 
<style type="text/css">
     .content {
           white-space: pre-wrap; /* CSS3*/
           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-all; /* Internet Explorer 5.5+ */
     }
</style>
 

http://egloos.zum.com/tsquare0/v/2766186 

<참고> 각 속성값 해설