I have searched many articles, that ie6 could not support postion:fixed, and maybe set position:absolute and top position. But I tried many times in my code and still can not work well, it makes me headache. Can anyone help me to modify my code for me? Thanks.
<!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>