min-height 속성을 IE6 에 주는 방법에서도 언급했듯이
IE6 은 max, min 개념이 없기 때문에 Hack을 써서 넣어주어야 한다. (IE6 *\#&*$@)

어떠한 이미지의 너비를 최대 500px 이상으로 넘어가지 않도록 하기 위해서는
IE6 을 제외한 모든 브라우저에서

#somewhere img {
   max-width: 500px;
}

라고 "한줄" 넣으면 끝난다.

그러나 우리의 구닥다리 IE6 은
저 속성을 읽지 못하고 img 너비를 있는 그대로 뿌려준다-_-

IE6 에만 적용해야 할 Hack은 다음과 같다.

#somewhere img {
   width: expression( this.clientWidth > 499 ? "500px" : "auto" );
}

expression 으로 IE6 만의 자바스크립트를 작성할 수 있으니 good.
하지만 어쩔 수 없이 꼼수를 써야 한다는 거~ 슬픈 현실ㅠㅠ

Posted by mkyoon



부모 element 의 높이를 그대로 받아
자식 element 에 높이를 지정하려면

부모와 자식에 같은 높이 px 값을 주면 된다.

그러나 부모의 높이가 항상 일정하지 않을 경우가 있다.
특정 상황에서 높이가 변한다면 자식에는 height: auto;를 주면 된다.
자식 element 에는 height: 100%를 주면 된다.

하지만
우리의 귀염둥이 IE 6 은 언제나 혼자 논다.
변하고 있는 부모 element의 height 와 상관 없이
자식 element는 부모 height를 늘여 있는 그대로를 전부 표시한다.

자바스크립트를 이용하여
getElementById 로 부모의 height를 설정하여 지정해야 하는건가
IE 6 하나 때문에 모든 브라우저에서 자바스크립트 렌더링을 해줘야 하는건가-_-

훗.
IE 6 핵 중에 expression 을 이용하면 단박에 해결된다.

#자식selector {
     height: expression(document.getElementById('부모id').style.height );
}


이럼 IE 6 만을 위한 스크립트 완성이다.
야호!

Posted by mkyoon