IE8下离顶部有空白

时间:2022-11-14 20:30:49
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>留英网|个人空间_英国租房二手兼职交友结伴同行分类信息网</title>
<style type="text/css">
<!--
*{margin:0px;padding:0px;}
a{text-decoration:none;}
.spacer{clear:both;line-height:0; font-size:0;}
#container{width:780px; margin:0 auto;}
#header{height:108px; background:url(images/head_bg.gif) no-repeat 0 0; color:#fff;}
.topright{text-align:right; margin:10px; font:12px Simsun;}
.topright a{color:#fff; margin:0 5px;}
h1{margin:15px 25px; font:36px "Microsoft YaHei",Simsun;}
#headmenu{background:url(images/nav_bg2.gif) repeat-x 0 1px; height:34px;}
#headmenu ul{list-style:none;}
#headmenu li{float:left; width:80px; text-align:center; font:bold 13px/33px Simsun;}
#headmenu li a{color:#fff; display:block;}
#headmenu li a:hover{color:#3195DB; background:url(images/nav_a_bg3.gif) center center no-repeat;}
#navurl{font:13px/26px Simsun; text-indent:10px; color:#069;}
#navurl a{margin:0 5px; color:#369;}
.left,.right{float:left;border:1px solid #1877ba;}
.left{width:243px; margin-right:10px; }
.left dt,.right dt{border:1px solid #fff; background:url(images/nav_bg2.gif) repeat-x 0 0; font:bold 14px/25px Simsun; color:#fff; text-indent:10px;}
.left dd,.right dd{padding:10px 5px; font-size:14px;}
.left dd p{text-indent:10px; line-height:1.5em;}
.mlevel{border:1px dotted #666; background:#D8EEFA; color:#666; font:bold 14px/25px Simsun; text-indent:25px;}
.mlevel span{color:#333; padding-left:20px;}
.panel{margin:5px auto; width:170px;}
.panel a{font:13px/22px Simsun; padding-left:20px; background:url(images/contacticon.png) no-repeat;}
#addf{background-position:0 -6px; margin-right:20px;}
#addm{background-position:0 -67px;}
.centr{text-align:center;}
.right{width:523px;}
h2 {color: #349ADE; margin:2px 10px;}
.right dt a{margin-left:370px; color:#fff;}
.right dd div{margin:5px 10px;}
.right dd div a{text-decoration:none;}
.right dd div a:hover{text-decoration:underline;}
.infottl,.infottl a{font:14px/20px Simsun; color:#333;}
.infocat,.infocat a{color:#666; font-size:13px;}
.right dd p {color: #1877BA; font-size:13px; margin:8px;}
.inforev,.inforev a{text-align:right; margin:5px; color:#699; font-size:12px; border-bottom:1px dashed #333; padding:5px 0;}
#footer{border-top:1px dotted #369; margin:20px 0; padding:20px 0; text-align:center; font-size:13px;}
#footer a{margin:0 5px;}
-->
</style>
</head>

<body>
<div id="container">
<div id="header"><div class="topright"><a href="#">登陆</a>|<a href="#">注册</a>|<a href="#">首页</a></div>
    <h1>XXX的个人空间</h1>
</div>
  <div id="headmenu"><ul>
    <li><a href="#">空间首页</a></li>
    <li><a href="#">个人资料</a></li>
    <li><a href="#">留言</a></li>
  </ul></div>
  <div id="navurl">您现在的位置: </div>
  <div class="left">&nbsp;
  </div>
  <div class="right">&nbsp;
  </div>
  <br class="spacer" />
    <div id="footer"><a href="#">友情链接</a>|<a href="#joinus.html">诚聘英才</a>|<a href="#aboutus.html">关于我们</a>|<a href="#announce.html">版权声明</a>|<a href="#contactus.html">联系我们</a>|<a href="#">网站公告</a>|<a href="#ads.html">广告服务</a></div>
</div>
</body>
</html>


IE8下离最顶上还有一点空白,IE6和IE7下正常

7 个解决方案

#1


*{margin:0px;padding:0px;top:0}加个top试试~·

#2


我不太习惯*的用法
一般我用
body{margin:0}
这样就不会有空白
还有
ul,ol,h1,h2,h3,h4,h5,h6,form{margin:0; padding:0}

#3


加body也一样的

#4


header 加1px的padding或者border

#5


实在不行就用这个吧
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
加在<head>里面

#6


谢谢5楼

4楼高人, 能问一下为什么这样能解决吗?

#7


边距重叠

那个空白是内部的元素的margin和父元素重叠

#1


*{margin:0px;padding:0px;top:0}加个top试试~·

#2


我不太习惯*的用法
一般我用
body{margin:0}
这样就不会有空白
还有
ul,ol,h1,h2,h3,h4,h5,h6,form{margin:0; padding:0}

#3


加body也一样的

#4


header 加1px的padding或者border

#5


实在不行就用这个吧
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
加在<head>里面

#6


谢谢5楼

4楼高人, 能问一下为什么这样能解决吗?

#7


边距重叠

那个空白是内部的元素的margin和父元素重叠