2010-11-28 14 views
0

J'ai cherché de nombreux articles, que IE6 ne pouvait pas supporter la position: fixe, et peut-être définir la position: absolue et la position supérieure. Mais j'ai essayé plusieurs fois ne peut pas bien fonctionner. Quelqu'un peut-il me aider à modifier mon code? (le effection est que mon émission de code dans IE8)position: fixed - issue dans IE6.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html> 
<head> 
<meta http-equiv="Content-type" content="text/html; charset=utf-8" /> 
<style type="text/css"> 
html, body{width:100%;height:100%;margin:0;padding:0;background-color:#fff;} 
#headerwarp{width:100%;height:78px;margin:0;padding:0;position:fixed;left:0;top:0;z-index:10;} 
#headertop{width:100%;height:28px;margin:0;padding:0;background-color:blue;position:fixed;left:0;top:0;z-index:10;} 
#headerbottom{width:100%;height:50px;margin:0;padding:0;background-color:green;position:fixed;left:0;top:28px;z-index:10;} 
#footerwarp{width:100%;height:53px;margin:0;padding:0;position:fixed;left:0;bottom:0;z-index:10;} 
#footerbottom{width:100%;height:65px;margin:0;padding:0;background-color:#000;z-index:10;} 
#localcontent{width:100%;margin:0;padding:78px 0 105px 0;top:0;} 
#content1{position:fixed;width:100%;height:20px;margin:0;padding:0;background-color:#ff0;z-index:10;top:78px;} 
#content2{position:fixed;width:100%;height:25px;margin:0;padding:0;background-color:#f00;z-index:10;top:98px;} 
.box{width:100%;position:relative;top:45px;padding:0;margin:0;} 
.slide {margin:10px;} 
.sl{width:100%;} 
li{margin:0 0 5px 0;padding:0;list-style:none;} 
ul li,li{width:400px;overflow:hidden;position:relative;} 
.contenttop{height:25px;position:fixed;z-index:10;top:123px;padding:0;margin:0;width:290px;background-color:#0FF;} 
.contentbottom{width:400px;float:left;padding:0;margin:0;height:1000px;} 
.col1, .col2, .col3{float:left;padding:0;margin:0 3px 0 3px;} 
.pcol1, .ptcol1{float:left;margin:0 0 6px 0;} 
.ptcol1{text-align:center;font-size:14px;color:#222;font-weight:bold;padding:0;position:fixed;z-index:10;top:148px;background:#f00;} 
.pcol1{padding:2px;position:relative;top:30px;background:#ff0;} 
.col1, .ptcol1{width:139px;} 
.pcol1{width:135px;} 
</style> 
</head> 
<body> 
<div id="headerwarp"> 
<div id="headertop"> 
    </div> 
    <div id="headerbottom"> 
    </div> 
</div> 
<div id="localcontent"> 
     <div class="box"> 
     <div id="content1"> 
      </div> 
      <div id="content2"> 
      </div> 
      <div id="sl"> 
       <ul class="ul" style="z-index:1;"> 
        <li class="li"> 
        <div class="contenttop"> 
          content 
         </div> 
         <div class="contentbottom"> 
          <div class="col1"> 
          <div class="ptcol1"> 
           content1 
           </div>         
           <div class="pcol1"> 
           111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/> 
           </div> 
          </div> 
          <div class="col1"> 
          <div class="ptcol1"> 
           content2 
           </div>         
           <div class="pcol1"> 
           111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/>111<br/> 
           </div> 
          </div> 
         </div>       
        </li> 
       </ul> 
      </div> 
     </div> 
</div> 
<div id="footerwarp"> 
<div id="footerbottom"> 
    </div>  
</div> 
</body> 
</html> 
+0

Tout d'abord, vous devez utiliser une réinitialisation CSS. Vous n'avez pas besoin de déclarer les mêmes propriétés CSS dans chaque élément que vous utilisez. C'est fou, c'est pourquoi vous avez des maux de tête. Il suffit de google pour réinitialiser CSS et ou utiliser Yahoos: (http://developer.yahoo.com/yui/3/cssreset/). Tout peut être fait si vous savez comment recoder votre travail et utiliser des solutions de contournement, positionnement inclus dans IE6. Je note celui qui vous donnera une réponse à votre problème, juste un conseil ... – Jonathan

+0

Peut-être que vous devriez mentionner ce que vous essayez réellement de réaliser? – RoToRa

+0

duplication possible de [IE 6 vs position: fixe] (http://stackoverflow.com/questions/1074335/ie-6-vs-positionfixed) – mercator

Répondre

0

Je ne le revendiquer comme ma propre solution, car ce serait injuste pour la personne qui a mis tant d'efforts dans la fixation, mais je crois que vous pourriez vouloir regarder le site Web de Stu Nicolls (CSS Play)