HTML 태그 중에 pre 태그는 그 내부에 있는 글을 있는 그대로 보여주는 특징이 있습니다. 그래서 Code를 보여줄 때 pre 태그를 사용해서 쓰고 있는데요, 이게 한 라인이 길어지면 스크롤바를 만들어서 보여주더라구요. ^^;;;;

사실 스크롤바를 보여줘도 상관은 없는데, 매번 스크롤해서 보려니 귀찮기도 하고... 그냥 다른 태그들처럼 다음 라인으로 개행을 해서 보여줘도 되는 것 같기도해서 방법을 찾아봤습니다.

역시나 구글신이 친절히 알려주셨는데, 아래처럼 css의 pre 태그 항목에 white-space: pre-wrap; 속성을 사용하면 됩니다. 좀더 자세한 내용은 http://stackoverflow.com/questions/248011/how-do-i-wrap-text-in-a-pre-tag 을 참고하시면 됩니다.

pre{
    background-color: #E6E6FA;
    padding:10px;
    overflow: auto;
    white-space: pre-wrap; /* pre tag내에 word wrap */
}  


아우... 이거 원 모르는게 많아서 진도가 나가질 않네요. ㅠㅠ 웹세상은 제가 아는 세상과 또 다른 세계인 것 같아요. ㅠㅠ

+ Recent posts