这是要逆天啊。。。。。浏览器不兼容的一个问题
问题就是在firefox，ie8里页面底部的文字和背景图会灵异的跑到最顶端，在导航条之上。。。实在是想不出为什么。。拜托各位了！！
首先，html代码：是模板页的
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>深圳网能达公司</title>
<link rel="stylesheet" type="text/css" href="images/Master.css"/>
<script type="text/javascript" src="images/bar.js"></script>
<script type="text/javascript">
$(function(){
$menuLi = $(".menu>ul>li");
$menuLi.hover(function() {
$(this).addClass("selected");
},function(){
$(this).removeClass("selected");
})
})
</script>
<asp:ContentPlaceHolder id="header" runat="server">
</asp:ContentPlaceHolder>
</head>
<body>
<form id="form1" runat="server">
<div class="xbody" >
<div class="head" style="height: 64px">
<ul>
<li><a href="Default.aspx"><span><img src="images/logo.gif" alt="" style="width: 228px; height: 86px;"/></span></a></li>
</ul>
</div>
<div class="menu">
<ul>
<li><a href="Default.aspx" style="width: 160px">首页</a>
</li>
<li><a href="#">关于网能达</a>
<ul><li style="left: 0px; top: 0px"><a href="brief.aspx">公司简介</a></li>
<li><a href="culture.aspx">企业文化</a></li>
<li><a href="talk.aspx">咨询反馈</a></li>
<li><a href="adminlogin.aspx">进入后台</a></li>
</ul>
</li>
<li><a href="#">公司动态</a>
<ul>
<li><a href="com_progress.aspx">发展进程</a></li>
<li><a href="future.aspx">未来规划</a></li>
</ul>
</li>
<li><a href="#">产品介绍</a>
<ul>
<li><a href="product.aspx";>产品展示</a></li>
<li><a href="product/pro.aspx";>资质证书</a></li>
</ul>
</li>
<li><a href="#">商务合作</a>
<ul>
<li><a href="coorperation.aspx">合作信息</a></li>
<li><a href="coorperation.aspx">联系方式</a></li>
</ul>
</li>
<li><a href="#" style="width: 165px">加入网能达</a>
<ul>
<li><a href="join.aspx">招聘信息</a></li>
<li><a href="join.aspx">招聘电话</a></li>
</ul>
</li>
</ul>
</div>
<div>
<asp:contentplaceholder id="ContentPlaceHolder1" runat="server">
</asp:contentplaceholder>
</div>
</div>
<div class="footer">
<ul><li>Copyright © 2012深圳市网能达科技有限公司 All rights reserved </li></ul>
</div>
</form>
</body>
</html>
css：
body {text-align:center;background-repeat:no-repeat; width:990px; margin:0 auto; padding:0px; background:url(../images/body_sky.jpg) no-repeat;}
div,form,ul,ol,li,span,p{ border:0px; padding:0px; margin:0px; font-size:12px;list-style:none;}
ul,ol,li{list-style:none}
a{color:Black; text-decoration:none;}
a:hover{color:Red;}
img{ border:none;}
.xbody{width:990px; text-align:left; margin:0 auto; height:95%;}
.head{height:100px; }
.head li{ float:left;}
.for{position: relative; left:900px; top:70px; font-size:16px; font-style:italic; font-weight:bolder;}
.menu{width:990px; float:left; display:inline; height:30px; background-image:url(../images/bar.gif); margin:10px auto;}
.menu ul,.menu li{float:left; display:inline; position:relative;}
.menu li a,.menu li a:hover{display:block; float:left; line-height:30px; width:160px; text-align:center; color:#FFF; font-size:14px;}
.menu li.selected a,.menu li a:hover{background:#008000; font-weight:bold; color:#00F;}
.menu ul li ul{position:absolute; left:0px; top:30px; display:none; width:160px;}
.menu ul li.selected ul{display:block;}
.menu li.selected li a,.menu li.selected li a:hover{background:#4490CE; color:#000; font-weight:normal;}
.menu li.selected li a:hover{background:#000; color:#FFF;}
.footer
{
text-align:center;
background-image:url(../images/foot_bg.jpg);
}
[解决办法]
你在footer上面加个float:left
[解决办法]
应该是上面的层有浮动的，所以影响到了他你如果给footer加上个clear:both应该也没问题的
