Internet Explorer 6 및 7에서 인라인 블록이 작동하지 않는 이유는 무엇이며 어떻게 해결할 수 있습니까?

Internet Explorer 6 및 7의 인라인 블록 문제

CSS의 인라인 블록 개념을 사용하면 요소가 인라인과 블록 모두로 동작할 수 있습니다. -레벨 요소를 동시에. 그러나 Internet Explorer 6 및 7에서 인라인 블록이 작동하지 않는 문제가 발생한다면 혼자가 아닙니다.

문제:

기본적으로 , inline-block은 범위와 같은 본질적으로 인라인 요소에서만 작동합니다. IE6 및 IE7의 div와 같은 다른 요소에 적용하면 예측할 수 없는 동작이 발생할 수 있습니다.

해결책:

이 문제를 해결하고 비 IE에서 인라인 차단을 활성화하려면 IE6/7의 인라인 요소를 사용하려면 해결 방법을 사용해야 합니다. 여기에는 다음 CSS를 추가하는 작업이 포함됩니다.

#yourElement {
    display: inline-block;
    *display: inline;
    zoom: 1;
}

해결 방법은 다음과 같습니다.

• *display: inline은 IE7 이하를 대상으로 하는 "안전한" CSS 해킹입니다. 이는 인라인 블록에 의해 설정된 표시 속성을 재정의합니다.
• zoom: 1은 IE6/7이 요소에 "레이아웃"을 적용하도록 강제합니다. 인라인 블록이 일관되게 작동하려면 레이아웃이 필수적입니다.

추가 고려 사항:

유효한 CSS를 유지하면서 이 해결 방법을 구현할 수 있지만 일반적으로 그렇지 않습니다. 특히 이미 다른 공급업체별 접두사를 사용하고 있는 경우 권장됩니다.

디스플레이에 대한 추가 정보는 다음을 참조하세요. inline-block, 외부 리소스를 참조하세요. 단, -moz-inline-stack은 Firefox 2에만 적용되므로 더 이상 필요하지 않습니다.

위 내용은 Internet Explorer 6 및 7에서 인라인 블록이 작동하지 않는 이유는 무엇이며 어떻게 해결할 수 있습니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!