IE8에서 인라인 블록 디스플레이가 작동하지 않는 이유는 무엇입니까?

IE8: 디스플레이 인라인 블록 문제 해결

웹 개발 영역에서 특정 시각적 레이아웃을 달성하려는 열망은 공통적인 과제를 안겨줍니다. 프로그래머를 위한. 이 프로세스의 한 측면에는 특히 다양한 브라우저 환경에서 올바른 요소 정렬을 보장하는 것이 포함됩니다. 종종 개발자들 사이에서 불만을 불러일으키는 요소 위치 지정 방법 중 하나는 인라인 블록 표시입니다.

문제:

다음 코드 조각을 고려하세요.

<style type="text/css" media="all">
  span, ul, ul li {
    display: inline-block;
    vertical-align: top;
    margin: 0;
    padding: 0;
    list-style: none;
  }   
</style>

<span>i would want</span>

• this
• on
• one line.

IE8에서 원하는 결과는 요소를 인라인으로 정렬하는 것입니다. 그러나 IE8의 인라인 블록 지원에도 불구하고 이러한 정렬을 달성하려는 시도는 실패한 것으로 입증되었습니다.

해결책:

놀랍게도 범인은 인라인에 있지 않을 수도 있습니다. -블록 선언 자체. 대신 누락된 문서 유형이 IE8의 올바른 표시 동작을 방해할 가능성이 높습니다. 이 문제를 해결하려면 다음 doctype 선언을 HTML의 첫 번째 줄에 추가하면 됩니다.

<p><strong>설명:</strong></p><p>doctype 선언은 브라우저가 다음에서 작동하도록 지시합니다. 특정 모드를 사용하여 지정된 HTML 사양과의 호환성을 보장합니다. 문서 유형이 없으면 IE8은 기본 호환성 모드를 사용하여 잠재적으로 인라인 블록 표시를 잘못 렌더링할 수 있습니다. doctype을 사용하여 렌더링 모드를 명시적으로 정의함으로써 이 동작을 재정의하고 원하는 인라인 블록 정렬을 활성화합니다.</p>

위 내용은 IE8에서 인라인 블록 디스플레이가 작동하지 않는 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!