IE7에서 어떻게 정렬 문제를 해결할 수 있습니까?

불행히도 IE7 (및 선호 IE6) 을 지원해야합니다. IE8, Safari, Firefox, Chrome에서 두 상자를 늘리기 위해 외부 div를 ujsing하는 것이 좋습니다.IE7에서 어떻게 정렬 문제를 해결할 수 있습니까?

------------------------------------ 
|         | 
| --------------  ----------- | 
| |   |  |   | | 
| |  A  |  | B | | 
| |   |  |   | | 
| --------------  ----------- | 
|         | 
------------------------------------

스타일 A와 B에 인라인 블록을 사용하고 있습니다. 두 상자에는 내부 div와 다른 요소가 있습니다.

그러나 IE6과 IE7을 사용할 때 나는이 괴물을 얻습니다.

------------------------------------ 
|         | 
| --------------     | 
| |   |     | 
| |  A  |     | 
| |   |     | 
| --------------     | 
|      ----------- | 
|      |   | | 
|      | B | | 
|      |   | | 
|      ----------- | 
|         | 
------------------------------------

무슨 일이 일어나고 있는지, 해결 방법에 대한 확실한 답변이 있습니까?

출처

2009-12-21 cannyboy

IE 6 및 7 인라인 블록에서는 자연어 표시가있는 요소 인 인라인에서만 작동합니다. 귀하의 박스는 <div>입니까? 그렇다면 작동합니다 .. 테스트 케이스가 있습니까? (자세한 정보를 원하시면 quirksmode.org하세요!)

IE block level element inline-block hack : 당신이

출처

2009-12-21 01:56:14

'인라인 블록 (inline-block) '크로스 브라우저를 사용하는 것이 더 쉽습니다 :'your selector {display : -moz-inline-box;/* 파이어 폭스 <3, 일부 가장자리 경우에 기발한 것입니다 ... */display : inline-block; * 디스플레이 : 인라인; * 확대/축소 : 1;/* 별 해킹 대상 IE <8; 확대/축소 트리거는 다른 부작용이없는 hasLayout * /' – eyelidlessness

첫째, 문서의 상단에 DOCTYPE을 넣어이 유용 할 수 있습니다. 이것은 IE를 단점 모드 (표준)로 강제합니다 (둘 다 완곡 어법). 예를 들면 : 당신이 IE6 호환성 사용 수레를 원하는 경우

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" 
"http://www.w3.org/TR/html4/strict.dtd">

이 두 번째로, (앤드류는 display: inline-block은 자연 display: inline 및 <div>을 가진 요소에 IE7에서 작동한다는 상당히 정확 자연 display: block있다). 이 작동해야

<div id="outer"> 
    <div id="left"></div> 
    <div id="right"><>/div> 
</div>

으로 : 외측 포함 패딩 테두리 마진의 폭보다 작은 좌우의 폭만큼

#outer { overflow: hidden; } 
#left { float: left; } 
#right { float: right; }

. 그렇지 않으면 오른쪽이 다음 행으로 내려갑니다.

출처

2009-12-21 01:57:29 cletus

참고 : ** doctype뿐만 아니라 ** strict ** doctype. 모든 doctype과 브라우저 동작에 대한 목록은이 사이트 하단의 표를 참조하십시오. (적어도 quirks 모드는 원하지 않습니다.) http://hsivonen.iki.fi/doctype/ – BalusC

float add

– ant

컨테이너의 오버플로 속성을 변경하는 경우 "clear : both"비트가 필요하지 않습니다. – cletus

IE7에서 어떻게 정렬 문제를 해결할 수 있습니까?

답변

관련 문제