이글루스 스킨 편집에 대해서

제 블로그는 원래 3월 20일에 공개된 이글루스 공식 스킨 중 하나인 soft를 사용했습니다.
제 블로그는 본문에 최대 800x600 크기의 이미지를 사용하는데 저 스킨은 최대 900 크기의 이미지를 크기 조절 없이 등록할 수 있기 때문입니다.
그런데 몇 주 동안 사용해보니 왼쪽 메뉴가 너무 넓고 글자가 너무 크다 보니 1280x1024의 해상도에서도 모든 메뉴를 볼 수 없는 불편함이 생기더군요.

그래서 스킨 편집을 해보려고 했지만, 예전에 홈페이지를 만들면서 익힌 CSS에 대해 거의 잊어버린 터라 일부 아는 것만 사용하여 soft 스킨에서 극히 일부만 수정하여 지금과 비슷한 스킨을 만들었습니다.
하지만 제가 수정한 스킨을 적용해보니 다음 페이지의 글에서 댓글을 누르면 아랫글들의 이미지가 서로 겹치거나 댓글이 아랫글 아래로 들어가 덧글을 볼 수 없는 문제가 발생하여 해결 방법을 찾아보려고 했지만 아는 것이 없어 일단 soft 스킨을 적용해 그 문제가 있는지 확인해 봤더니 공식 스킨에서도 똑같은 문제가 발생하더군요.

어쩔 수 없이 그 문제를 해결할 방법을 찾고자 이글루스 고객 센터 블로그를 찾아봤지만, 그 스킨의 문제점을 지적하는 이글루스 사용자의 댓글만 있을 뿐 해결했다는 답변은 없고 스킨 편집에 대해서도 간단하게 설명하고 있기에 결국 CSS 책자를 다시 꺼내 참고하면서 스킨의 각 부분에 border : solid 1px blue를 입력하여 각 부분의 범위를 파악하며 수정한 끝에 그 문제를 해결할 방법을 찾아냈습니다.
바로 position 스타일 부분에서 #sidebar에만 float : left를 사용하고, #contents에서는 쓰지 않는다는 점이 이상해 float : left와 margin-left: ??px 를 삽입하고 수치를 고쳐봤더니 어떤 크기의 브라우저라도 메뉴와 글이 왼쪽에 고정되고 그 문제도 사라지더군요.
드디어 골치아픈 문제도 해결하였기에 댓글 부분을 포함해 일부분을 더 수정한 끝에 지금과 같은 저만의 스킨을 만들어 이용하고 있습니다.

스킨을 편집하려면 HTML 태그와 CSS에 대해 알고 있어야 하는 어려움이 있지만 이에 대해 자세히 설명해주는 사이트의 도움을 얻으며 공식스킨을 포함해 다른 사람이 만든 스킨을 토대로 잡아 스킨의 각 부분에 border : solid 1px blue 를 입력하여 각 부분이 무엇을 의미하는지 파악한다면 자신만의 스킨을 만드는 것이 그리 어렵지 않다고 생각합니다.