문제

나는 4 개의 div를 사용하고있다 순수한 포지셔닝, 각각은 페이지의 DOM 요소가 선택된 경우처럼 보이기 위해 한 번 함께 그룹화 된 사각형의 경계입니다 (이는 DIV를 오버레이로 사용하여 CSS 경계 동작을 모방).

  • 왼쪽에는 a가 있습니다 테두리가 "4px solid red"로 설정되었습니다., ㅏ 0p의 너비x와 a 선택한 DOM 요소의 높이와 동일한 높이.

  • 상단 1은 테두리 상단이 "4px solid red"로 설정되어 있고 높이는 0px, 너비는 선택한 DOM 요소의 너비와 같습니다.

등이 어디로 가는지 알 수 있습니다.

나는 이것이 이상하다는 것을 알고 있지만 매우 유용하다. Aardvark 예를 들어.

FF, Opera, Safari 및 Chrome의 모습은 다음과 같습니다.

Alt Text http://img243.imageshack.us/img243/429/captureyv.png

그리고 여기가 어떻게 생겼는지가 있습니다 IE 8 :

Alt Text http://img190.imageshack.us/img190/7196/capture1dv.png

즉시 박스 모델 문제를 생각했지만 좁게 만들어야한다고 생각하지 않습니까? 어쨌든, 나는 사용했습니다 jQuery 폭과 높이를 얻으려면 이런 종류의 문제를 방지해야합니다. 나는 가로 질러 갔다 가장 잘 알려진 IE 버그, 그러나 성냥을 찾을 수 없습니다.

어떻게 생각해 ?

추신 : 이것은 북마크입니다. 물론 로컬 파일에서 DocType를 변경하려고했지만 효과가 있었지만 제작에서는 할 수 없습니다.

IE DEV 도구 모음을 사용하여 절대로 배치 된 요소 주위에 테두리를 그립니다.

Alt Text http://img21.imageshack.us/img21/3425/capture2uc.png

우리는 그 차이를 볼 수 있습니다.

도움이 되었습니까?

해결책

IE8의 개발자 도구 모음을 사용하여 "하단의 실제"높이 "테두리를 점검하십시오. "0"인지 확인하십시오.

해당 하단 Div에 대해 다음을 시도하십시오.

<style type="text/css">
    #bottomBorder{
        /* Adding '!important' to each CSS rule 
           will make sure nothing else in your code is 'overwriting'
           that rule. (doesn't work for IE6)
        */
        line-height:0 !important; 
        font-size:0 !important;
        height:0 !important;
        border-bottom:solid 4px red;
        position:absolute;
    }
</style>

또는 시도 :

<style type="text/css">
    #bottomBorder{
        border-top:solid 4px red;
    }
</style>

내가 생각하는 것은 IE가 DIV를 0px 높이로 설정하지 못하게한다는 것입니다. 나는 전에 divs에서 이것을 보았다.

다른 팁

나는 당신이 당신의 doctype와 함께 바이올린을 가져야한다고 생각합니다.

이 문제는 여백과 패딩과 관련이 있다고 가정합니다. DIV 내부에 정보 나 스페이서가 있습니까? 이것은 당신이 설명하지 않은 여분의 공간을 초래할 수 있습니다.

마진으로 div를 조정합니다 : 0; 국경-콜라스 : 붕괴;

또한, 당신이 언급했듯이, 당신의 하단 div에서 당신은 그 중심에 설정되어 있어야합니다. 당신은 DIV 자체 내에서 마진이나 간격으로 인해 그러한 간격이 발생하는 것을 막기 위해 상단 테두리로 설정해야합니다.

IE8이 경계의 높이를 높이 매개 변수의 일부로 포함하지 않을 수 있습니까? 테두리의 크기도 추가 해보십시오.

좋아, 지금은 해결책이 없지만 바닥 부두 대신 바닥 부두 상단을 표시하고 지금은 충분히 좋아 보인다. 누구든지 더 잘 알고 있다면 그는 여전히 환영합니다.

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top