웹1.0/CSS, CSS2
display 의 inline-block 속성 사용법
커드만
2016. 3. 21. 22:28
display 의 inline-block 속성을 사용할때 가끔 크로스브라우징에 문제가 발생하곤 합니다.
지금부터 그런 문제들의 대한 해결방안을 설명해 드리겠습니다.
IE6 ~ 7 문제
익스플로서의 낮은 버전의 브라우저에서 생기는 문제로
inline태그에 inline-block 속성을 사용 : 이상없음
block태그에 inline-block 속성을 사용 : inline-block을 block 속성으로 인식하는 버그
1 2 | /* 해결방법 */ .className{*display:inline; *zoom:1;} | cs |
FF2 문제
display:-moz-inline-stack 을 사용하여 해결.
(이것보다 더 의미에 맞는 속성은 display:-moz-inline-box 속성 이나 -moz-inline-box 속성을 사용할 경우 FF에서 조금씩 영역을 제대로 잡지 못하는 문제를 발견)
- 참조 -