IE7은 디스플레이를 이해하지 못합니다 : 인라인 블록

누군가이 버그를 해결하는 데 도움을 줄 수 있습니까? Firefox에서는 잘 작동하지만 Internet Explorer 7에서는 그렇지 않습니다. 를 이해하지 못하는 것 같습니다 display: inline-block;.

html :

<div class="frame-header">
    <h2>...</h2>
</div>

CSS :

.frame-header {
    height:25px;
    display:inline-block;   
}

IE7 display: inline-block;핵은 다음과 같습니다.

display: inline-block;
*display: inline;
zoom: 1;

기본적으로 IE7은 inline-block자연 inline요소 ( Quirksmode Compatibility Table ) 만 지원 하므로 다른 요소에 대해서는이 핵만 필요합니다.

zoom: 1트리거에이 hasLayout행동, 우리는 사용 성급 숙박 시설은 해킹을 설정에 display에 inline(그것을 적용되지 않습니다 새로운 브라우저) IE7 낮은로만. hasLayout와 inline함께 기본적으로 트리거 inline-block우리는 행복하다, 그래서 IE7에서 작동합니다.

이 CSS는 유효성을 검사하지 않으며 어쨌든 스타일 시트를 엉망으로 만들 수 있으므로 조건부 주석을 통해 IE7 전용 스타일 시트를 사용하는 것이 좋습니다.

<!–-[if IE 7]>
<link rel="stylesheet" href="ie7.css" type="text/css" />
<![endif]–->

최신 정보

아무도 IE6과 7을 사용하지 않기 때문에 더 이상 나는 다른 해결책을 제시합니다 :
IE8이 때문에, 더 이상 해킹을하지 않아도 그 자체로 지원하는

IE8 전에 그 석기 시대 브라우저 (그것은, 너무 IE8가 오래이지 않는다 지원해야하는 사람들을 위해 기침 ) :
IE 버전 관리의 부담을 일부 조건부 클래스를 사용하여 <html>태그처럼 폴 아일랜드 인 의 상태 그의 기사

<!--[if IE 7]><html class="no-js lt-ie9 lt-ie8"><![endif]-->
<!--[if IE 8]><html class="no-js lt-ie9"><![endif]-->
<!--[if gt IE 8]><!--><html class="no-js"><!--<![endif]-->

이것에 의해 당신은 다른 IE 브라우저를 위해 html-tag에 다른 클래스를 갖게 될 것입니다

필요한 CSS는 다음과 같습니다

.inline-block {
    display: inline-block;
}
.lt-ie8 .inline-block {
    display: inline;
    zoom: 1;
}

이것은 유효하며 추가 CSS 파일이 필요하지 않습니다.

이전 답변

.frame-header
{
    background:url(images/tab-green.png) repeat-x left top;
    height:25px;
    display:-moz-inline-box;    /* FF2 */
    display:inline-block;   /* will also trigger hasLayout for IE6+7*/
}
/* Hack for IE6 */
* html .frame-header {
    display: inline; /* Elements with hasLayout and display:inline behave like inline-block */
}
/* Hack for IE7 */
* + html .frame-header {
    display: inline; /* Elements with hasLayout and display:inline behave like inline-block */
}

IE7은 '인라인 차단'을 제대로 지원하지 않습니다. 자세한 내용은 여기를 참조하십시오. LINK
대신 '인라인'을 사용할 수 있습니다.

정확히 무엇을 달성하려고합니까? 우리를 예로 들어 여기에 넣으십시오 : http://jsfiddle.net/

인라인을 사용하면 목록 항목에 대해 이러한 종류의 선택기와 함께 작동합니다.

ul li {}

또는 구체적으로 :

ul[className or name of ID] li[className or name of ID] {}