IE7 CSS 버그? 해결: Blogger, Blogspot 네비게이션바 Crop 문제

최신 버전인 "인터넷 익스플로러 버전 7 (Internet Explorer 7; IE 7)" 을 오늘 시험삼아 설치해 보았는데, 역시 예상대로 CSS 에 관련된 문제가 발생했습니다.

이 블로그 최상단에 갈색 상태바(실은 상태바가 아니라 네비게이션 바임)가 있는데, 페이지 윗부분이 상태바 속으로 밀려 올라가는 것이었습니다. 그래서 "mwultong Blog ― 소설 / IT"라는 제목과 그림(현재 붓과 와인잔 사진)이 있는 영역 즉, "헤더 부분"이 반쯤 잘려나갔습니다.

이 문제를 고치느라 반나절이 걸렸습니다. 이 문제는 구글 블로그인 Blogger.com (블로거 닷컴)에서만, 즉, blogspot.com 에 있는 블로그에만 해당되는 것 같습니다. 새 템플릿에서는 문제가 없고, "새 버전의 블로거닷컴"에서 옛날식 템플릿을 사용하는 경우에만 발생했습니다.

CSS 를 해석하는 데 있어 IE6과 IE7의 미묘한 차이 때문일 수도 있지만, 파이어폭스 2.0에서는 아무 문제가 없는 것으로 봐서는 버그일 수도 있습니다.

아무튼 다음과 같은 방법으로 해결했습니다.

블로거 템플릿 고치기

이렇게 템플릿의 body 태그 바로 다음에



위의 파란색 코드 한줄을 추가해 주는 것입니다. 이렇게 해주니, 정상화되었습니다.


이 외에는 CSS 에 대한 문제가 없었습니다.