CSS论坛 - Powered by Discuz! Board

标题: 绝对定位在IE和Firefox中表现的区别 [打印本页]

作者: djwin89 时间: 2011-9-17 17:41 标题: 绝对定位在IE和Firefox中表现的区别

代码
/* CSS Document */
body,dl,ol,h1{
margin:0px;
padding:0px;
}
a{ color:#333333; text-decoration:none}
a img{border:0px}
li{list-style:none}
#container{
width:980px;
margin:0 auto;
float:none;
}
#head{
position:relative;
width:100%;
height:136px;
background:url(../images/h_bg.jpg) no-repeat -22px 0px;
}
.logo{
width:280px;
height:100px;
float:left;
}
.upright_menue{
width:45%;
height:28px;
float:right;
padding:13px 0px 0px 0px;
}
.upright_menue ul li{
float:left;
font:12px/28px "宋体";
}
.downright{
width:62%;
float:right;
}
.topguide{
position:absolute; right:40px; top:100px;
clear:both;
width:100%;
   }
.topguide li{
float:left;
width:84px;
text-align:center;
font-weight:bold;
}
.topguide li a{
padding:8px 10px; line-height:32px;
color:#333;
font-size:14px;
}
.topguide li a:hover{
background:url(../images/nav_bg.gif) no-repeat
}

<!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=gb2312" />
<link rel="stylesheet" type="text/css" href="../css/style.css" />
<title>无标题文档</title>
</head>
<body>
<div id="head">
<div class="logo"></div>
<div class="upright_menue"></div>
<div class="downright"> 你好，欢迎访问贵美商城</div>
<div class="topguide">
<ul>
<li><a href="#">首  页</a></li>
<li><a href="#">家用电器</a></li>
<li><a href="#">手机数码</a></li>
<li><a href="#">日用百货</a></li>
<li><a href="#">书  籍</a></li>
<li><a href="#">帮助中心</a></li>
<li><a href="#">免费开店</a></li>
<li><a href="#">全球咨询</a></li>
</ul>
</div>
</div>
</body>
</html>

在IE中显示正常，但在FF中标题却往下移动了一段距离，这个是为什么？

欢迎光临 CSS论坛 (http://www.divcss5.com/bbs/)