ie6 CSS 디스플레이가 잘못되었습니다.

안녕하세요 저는 CSS 메뉴를 사용 중이며 ff 및 ie7/8에서는 잘 보이지만 ie6에서는 메뉴가 올바르게 배치되지 않았습니다. 그것은 오른쪽으로 앉기로되어 있지만 어떤 이유로 왼쪽으로 움직이고 있습니다. 나는 스크린 샷과 메뉴에 대한 CSS를 포함 시켰고 누군가가 오류가 어디에 있는지 말해 줄 수 있다면 고맙겠습니다. 많은 감사ie6 CSS 디스플레이가 잘못되었습니다.

#menu 
    { 
     width:425px; 
     height:33px; 
     float: right; 
     margin:133px 51px 0 0; 
     padding:0px; 
    } 
#menu ul 
    { 
     width:525px; 
     height:33px; 
     float:left; 
     margin:0px; 
     padding:0px; 
     display:block; 
    } 
#menu ul li 
    { 
     width:76px; 
     height:33px; 
     float:left; 
     margin:0 1px 0 0; 
     padding:0px; 
     display:block;  
    } 
#menu ul li a.menu 
    { 
     width:76px; 
     height:26px; 
     float:left; 
     margin:0px; 
     padding:7px 0 0 0; 
     font-family:Arial; 
     font-size:13px; 
     font-weight:bold; 
     color:#FFF; 
     text-align:center; 
     text-decoration:none; 
     background-image:url(../images/menu.jpg); 
     background-repeat:no-repeat; 
    } 
#menu ul li a.menu:hover 
    { 
     width:76px; 
     height:26px; 
     float:left; 
     margin:0px; 
     padding:7px 0 0 0; 
     font-family:Arial; 
     font-size:13px; 
     font-weight:bold; 
     color:#FFF; 
     text-align:center; 
     text-decoration:none; 
     background-image: url(../images/menuover.jpg); 
     background-repeat:no-repeat;   
    }

스크린 샷 :

올바른 메뉴 간격 : http://i51.tinypic.com/9kytxf.png

잘못된 메뉴 간격 : http://i54.tinypic.com/fldpow.png

출처

2011-04-26 ploppy

잘 모르겠지만 위치 : 상대를 시도하십시오. – user455318

@ user455318 여전히 동일합니다. 덕분에 – ploppy

나는 이것이 도움이되지 않는다는 것을 깨달았지만, 나는 의무감을 느꼈다 : http://ie6countdown.com/ – Jimmy

내 생각 엔 당신의 크기가 올바르게 추가하고 그 IE의 처리가 없다는 것입니다 다른 사람들과 다르다. 예를 들어 #menu의 너비는 425px이지만 ul의 너비는 525px입니다. 따라서 FF는 오버 플로우를 클리핑하지만 IE는 그렇지 않습니다.

가장 안쪽의 요소 (예 : #menu ul li a.menu)를 제외한 모든 요소에서 너비를 제거하고 나머지는 자동으로 크기 조정하도록하십시오. 또는 최소한 #menu 너비를 제거/고정하여 시작하십시오.

출처

2011-04-26 22:10:01 Jacob

나는 메뉴 div에서 너비를 제거했고 오른쪽으로 조금만 움직였다. 덕분에 – ploppy

같은 방향으로 여백의 float이 때 이전 Double Margin Float Bug, 수 있습니다 .. 즉 왼쪽 플로트/왼쪽 여백 또는 오른쪽 플로트/오른쪽 여백 IE5/6 여백

을 두 배로 알려져 등등 :

#menu { 
     width:425px; 
     height:33px; 
     float: right; 
     margin:133px 51px 0 0; 
     padding:0px; 
    }

시도 그게 있다면, 그것은 다른 모든 브라우저가 바로 뜨게 요소의 디스플레이 속성을 무시 같은 장소에서 떠나 안전한 수정

출처

2011-04-26 22:10:18 clairesuzy

표시 코드가 오른쪽으로 분수 이동되었습니다. 덕분에 – ploppy

하면 확인이있어, 위의 규칙에 display:inline; 추가 프로가있다. CSS를 사용하여 HTML 파일의 시작 부분에 doctype 당. IE6의 단점 모드는 끔찍합니다! 예를 들어 :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

를 적어 둡니다 적절한 (비 HTML5) 문서 타입은 DTD를 가리키는 URL을 것입니다. doctype이 올바르지 않으면 수정하고 도움이되는지 확인하십시오.

출처

2011-04-27 00:54:05 Trav

이것은 내가 머리 앞에 가지고있는 것이다. 감사합니다. – ploppy

Doctype을 사용하면 좋습니다. 귀하의 문제는 똑바로 CSS를 관련이 있습니다. 내가 doctype을 검사 할 것을 제안한 이유는 내가 수년간 본 수많은 사람들이 적절한 doctype을 가지지 않아서 quirks 모드에 희생되어서, 특히 부동 한 CSS 동작을 유발할 수 있기 때문이다. 자세한 내용은 http://www.quirksmode.org/css/quirksmode.html을 참조하십시오. – Trav

여전히 내 머리를 긁어 모으고 있습니다 .-) – ploppy

ie6 CSS 디스플레이가 잘못되었습니다.

답변

관련 문제