[SyntaxHighlighter] 높이 변경하기

  지난 포스트 티스토리에 소스코드 보기 좋게 올리기에서 티스토리에 Syntax Highlighter를 설치하는 방법을 알아봤다. 그런데 그대로 사용하니 긴 코드를 올리니 아래 사진과 같이 너무 길어져서 보기에 안좋았다. 그래서 높이를 조절하는 방법을 찾아보았는데 의외로 그 방법이 나온 곳이 없었다. 어쩌면 코드가 길어지는게 크게 신경쓰이지 않거나, CSS를 잘 아는 사람들한테는 너무 쉬운거라 물어보거나 블로그에 올린 사람이 없는지도 모르겠다. 여하튼 이번 포스팅은 Syntax Highlighter의 코드 길이를 제한하는 방법을 알아보자.

  사실 포스팅 하기도 좀 애매할 만큼 아주 간단하다. Syntax Highlighter의 shCore.css파일을 열고 아래 57번째 줄을 삽입해주면 된다. 여기서 max-height을 height으로 바꾸면 정해진 높이보다 코드가 적을 때 빈공간이 남아있게 되고, max-height은 자동으로 높이가 조절된다. 

  높이를 325px로 정하니 25줄까지 보여지고 그 밑의 코드는 아래와 같이 스크롤을 내려서 확인 할 수 있다. 티스토리에서는 shCore.css파일을 바로 수정할 수 없으니 파일을 컴퓨터에서 수정해서 업로드하면 된다.