HTML 코딩을 하다보면

CSS의

display:inline-block

속성을 사용하고 싶을 때가 종종 있지만,

늘상 IE6, IE7 때문에 포기하고 만다.

IE6, IE7에서는 inline-block을

그냥 block으로 인식해버리기 때문이다.

그러나 IE6, 7에서도 inline-block을 사용 할 수 있다!

block을 inline-block으로 바꿔도 block으로 인식되는 문제가 있는데,

반면에 inline인 요소를 inline-block으로 바꿀 때는 문제가 되지 않는다.

IE6,7에서는 다음과 같이 속성을 주면 block을 inline-block으로 바꾸어 사용 할 수 있다.

div{display:inline-block;zoom:1;*display:inline/*IE7 HACK*/;
_display:inline;/*IE6 HACK*/}

이제 인라인 블럭을 사용하여 마크업을 해보자.



'css 이야기' 카테고리의 다른 글

CSS로 엘리먼트 회전시키기  (0) 2013.02.01
IE6, IE7에서 display:inline-block 사용하기  (0) 2012.11.20