позиция: исправлена ​​- проблема в IE6. - PullRequest
Новая
       23

позиция: исправлена ​​- проблема в IE6.

0 голосов
/ 28 ноября 2010

Я искал во многих статьях, что ie6 не может поддерживать позицию: фиксированную и, возможно, установить позицию: абсолютную и верхнюю позицию.Но я пытался много раз не может работать хорошо.Может ли кто-нибудь помочь мне изменить мой код? (Эффект в том, что мой код отображается в ie8) 

<!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>

1 Ответ

0 голосов
/ 30 ноября 2010

Я не буду претендовать на это как на свое собственное решение, потому что это было бы несправедливо по отношению к человеку, который приложил столько усилий для его исправления, но я думаю, что вы, возможно, захотите взглянуть на веб-сайт Stu Nicolls ( CSS Play )

...