반응형


통 min-height를 쓸땐, ie6에서 작용하지 않으므로, 기존엔 ie에서만 먹는 _height를 사용했다.

하지만 핵을 쓰는 것때문에 Validator에 걸림.

소스는 좀 길어지지만 핵 안쓰고, 모든 브라우저에서 정상적으로 작동하게 할 수 있는 방법

 


min-height, height 핵(hack)없이 사용하기

div {
  min-height:500px;
  height:auto !important;
  height:500px;
}

 

순서 매우 중요

  1. min-height :  ie7이상 및 표준브라우저에서 작용.
  2. height:auto !important : 표준브라우저에서 아래 height 속성을 무시하고 min-height이상인 컨텐츠가 컨텐츠 영역을 벗어날 때, div가 자동으로 늘어날 수 있도록 함.
  3. height : ie6이하 버젼에서 작용. 셀렉터 안에서 같은 속성을 여러번 작성했을 경우 ie6은 가장 마지막에 선언한 속성을 가져가므로 맨 마지막에 적는다.

반응형

'# Work > HTML/CSS' 카테고리의 다른 글

display:inline-block 이란?  (0) 2011.04.27
filter:alpha 반투명 효과주기  (0) 2011.04.26
<abbr>과 <achronym>  (0) 2011.03.24
마진 통합현상(collapsing margin)이란?  (0) 2011.03.24
Float를 Clear하는4가지 방법  (0) 2011.03.17
호정찐