2010-04-25 3 views
3

Internet Explorer의 상위 DIV에 하나의 DIV를 넣을 수 없습니다. Firefox가 곁에 서서 노력하고 있습니다.IE8 및 z- 인덱스 CSS 속성의 이상한 문제

IE에서 HTML 파일을 직접 열면 모든 것이 정상적으로 작동한다는 것이 이상한 부분입니다. 그러나 서버에 업로드하고 거기에서 열면 div는 그의 부모 밑에 숨겨집니다.

여러 개의 Z- 색인 조합을 시도했지만 아무 것도 작동하지 않습니다.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" > 
<head> 
    <title>Test</title> 
    <meta http-equiv="content-type" content="text-html; charset=utf-8" /> 

<style type="text/css"> 

.col { float:left; width:310px; margin-right:13px; } 

.art { position:relative; border-bottom: 1px solid #d0d0d0; font: normal normal bold 11px Arial,Verdana,Helvetica; color:#A0A0A0; width:310px; height:50px; top:0px; left: 0px; margin-right:10px; background-color:#F0F0F0; } 
.art a { padding:3px; display:block; width:304px; height:100%; color:#707070; } 
.art a:visited { color:#A0A0A0; } 
.art a:hover { background-color:#E0E0E0; } 

.box { z-index:1000; background-color:#A0A0A0; color:#404040; font: normal normal bold 11px Arial,Verdana,Helvetica; display:none; position:absolute; top:30px; left:10px; text-align:left; border:3px solid #707070; margin:5px 0px 5px 5px; font-size:10px; color:White; width:100%; } 

</style> 


<script type="text/javascript"> 

function sh(obj) 
{ 
    var el = document.getElementById(obj); 
    if (el.style.display != 'block') { 
    el.style.display = 'block'; 
    } 
    else 
    { 
    el.style.display = 'none'; 
    } 
} 

</script> 
</head> 
<body> 


<div class="col"> 


<div class="art"> 
<a href="" target="_blank" onmouseover="javascript:sh('i0')" onmouseout="javascript:sh('i0')">Title 1</a> 

<div id="i0" class="box"> 
<div class="text"> 
Les "chemises rouges" manifestent depuis la mi-mars pour faire tomber le gouvernement et occupent depuis trois semaines un quartier touristique et commerçant autour duquel ils ont érigé des barricades. 
</div> 
</div> 

</div> 


<div class="art"> 

<a href="" target="_blank" onmouseover="javascript:sh('i1')" onmouseout="javascript:sh('i1')">Title2</a> 

<div id="i1" class="box"> 
<div class="text"> 
Une association ardéchoise accueillant des séminaires de "bien-être" et de "développement personnel" a refusé d'accueillir un stage de danse en invoquant l'homosexualité des participants, ont indiqué aujourd'hui les organisateurs. 
</div> 
</div> 

</div> 


</div> 
</body> 
</html> 

여기 어떻게 진행되고 있어요 : 여기

코드인가?

+0

재현 ..... – SLaks

답변

1

다른 스태킹 컨텍스트가 여기에 있습니다. Z-인덱스 및 위치는 까다로운 일이 될 수 있습니다

http://css-discuss.incutio.com/wiki/Overlapping_And_ZIndex

+0

예, IE6-7를 사용하여 문제가 이런 종류의 웹에 많은 정보가있다. 이 코드는 HTML 파일을 만들고 브라우저에서 직접 열면 작동합니다. 그러나 서버에 업로드하면 ... 또한 이런 종류의 문제는 IE8에서 해결되어야합니다. – InfoStatus

+0

@ DK39, "IE8에서도 이런 종류의 문제가 해결되어야합니다." 감히 IE가있는 한 IE 버그와 관련 광기가 존재할 것입니다. –