Browsed by
[Tag:] hack

[CSS] IE7, IE8 호환성 보기 모드에서 display:inline-block; 사용하는 방법

[CSS] IE7, IE8 호환성 보기 모드에서 display:inline-block; 사용하는 방법

IE 8버전 호환성보기 모드와 IE7에서는 display:inline-block; 이 지원되지 않습니다. 레이아웃을 잡는데 자주 사용되기 때문에 쓰지 않을 수 없는 코드입니다. 이를 사용하기 위해서는 IE에 적용되도록 CSS 핵을 사용해야합니다. 아래는 IE8 호환성보기와 IE7에 적용할 수 있는 display:inline-block의 CSS 핵입니다. [기존] <div style=”display:inline-block;”></div> [변경] <div style=”display:inline-block; zoom:1; *display:inline;”></div> 위와 같이 zoom:1과 *display:inline; 을 추가해주시면 되고 display앞에 *은 IE7(IE8 호환성보기)에서만 적용될 수 있도록 하는 CSS핵 입니다. CSS핵에 대한 더 자세한 내용은 [css] IE 버전 별 CSS 핵 정리 을 참조하시기 바랍니다.

[css] IE 버전 별 CSS 핵 정리

[css] IE 버전 별 CSS 핵 정리

IE6부터 IE9까지 자주 쓰이는 CSS 핵을 정리해봤습니다. IE6은 버리는 추세이고 IE8이상으로는 어느 정도 타 브라우저와 호환성이 준수한 편입니다. 하지만 IE7은 국내에서 아직까지 가장 많이 사용되고 있지만 IE6 수준과 버금가는 호환성을 지니고 있기에  무시 할 수 없습니다. IE7 위주로 CSS핵을 잘 숙지해두시더라도 코딩 작업에 도움이 많이 될겁니다. (핵은 예시 구문에 주황색으로 표시했습니다.) 단일 적용 핵 IE6 언더스코어 핵 (underscore hack) – 적용 범위 : property => div{_width:150px; _height:70px;}   IE7 *+html body 핵 – 적용 범위 : selector => *+html body div{width:100px;…

Read More Read More