为什么在FF里DIV的内容重叠了呢
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN " "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd ">
<HTML xmlns= "http://www.w3.org/1999/xhtml ">
<HEAD>
<TITLE> xx论坛 </TITLE>
<META http-equiv=Content-Type content= "text/html; charset=gb2312 ">
<META content= "MSHTML 6.00.3790.2858 " name=GENERATOR>
<style>
BODY{
text-align:center;
margin:0 auto;
font-size:12px;
color:#444444;
font-family: Arial, Helvetica, sans-serif;
background-color:#FFF;
line-height:1.5em;
}
FORM {
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px
}
A IMG {
BORDER-RIGHT: 0px; BORDER-TOP: 0px; BORDER-LEFT: 0px; BORDER-BOTTOM: 0px
}
INPUT {
PADDING-RIGHT: 0px;
PADDING-LEFT: 0px;
PADDING-BOTTOM: 0px;
MARGIN: 0px;
PADDING-TOP: 0px;
}
SELECT {
PADDING-RIGHT: 0px;
PADDING-LEFT: 0px;
PADDING-BOTTOM: 0px;
MARGIN: 0px;
PADDING-TOP: 0px;
z-index:0;
}
TEXTAREA{
PADDING-RIGHT: 0px;
PADDING-LEFT: 0px;
PADDING-BOTTOM: 0px;
MARGIN: 0px;
PADDING-TOP: 0px;
}
DL,DT,DD{
margin:0px;
padding:0px;
background:transparent;
}
DIV{
margin:0 auto;
}
UL,LI{
margin:0px;
padding:0px;
list-style:none;
}
SPAN{
padding:0;
margin:0;
}
/***********************/
/*****HEADER START******/
.HEADER{
color:#666666;
width:960px;
height:60px;
z-index:1;
margin-bottom:12px;
}
.HEADER ul{
margin:10px;
}
.HEADER li{
float: right;
color:#666666;
cursor:pointer;
padding-top: 30px;
}
/*****HEADER END********/
/*****FOOTER START******/
.FOOTER{
width:960px;
padding: 2px;
}
/*****FOOTER END********/
/*****MODULE START******/
.MODULE{
width:960px;
border:1px solid #C8C8C8;
margin-bottom:12px;
padding:0px;
}
.MODULE_TITLE{
position:relative;
margin-top:2px;
height:25px;
background-repeat:repeat-x;
background-position:center;
cursor:move;
background-image: url(../Images/bg_title_middle.gif);
}
.TITLE_LEFT{
position:absolute;
left:0px;
top:4px;
font-weight: bold;
padding-left: 10px;
}
.TITLE_RIGHT{
position:absolute;
right:-1px;
top:4px;
padding-right:3px;
}
.MODULE_CONTENT{
}
/*****MODULE END********/
/*****FORUMLIST START********/
.FORUMLIST_TITLE{
height:20px;
margin-bottom:5px;
}
.FORUMLIST_TITLE li{
float:left;
height:20px;
padding-top:5px;
font-weight:bold;
}
.FORUMLIST{
height:10px;
}
.FORUMLIST li{
float:left;
height:40px;
}
/*****FORUMLIST END********/
/*****FORUMSTATE START*********/
.FORUMIMAGELIST{
width:320px;
border:1px solid #C8C8C8;
height:50px;
margin-bottom:15px;
}
.FORUMIMAGELIST li{
float:left;
margin:10px;
}
/*****FORUMSTATE END*********/
</style>
</HEAD>
<BODY>
<DIV class=HEADER>
<UL>
<LI onclick=javascript:> 博客 </LI>
<LI onclick=javascript:Default()> 默认版面 | </LI>
<LI onClick= "javascript:location.href= 'Search.html ' "> 资源搜索 | </LI>
<LI onClick= "location.href= 'Register.html ' "> 用户注册 | </LI>
<LI onClick= "location.href= 'Register.html ' "> 用户登陆 | </LI>
<LI onClick= "location.href= '../Index1.html ' "> MyWeb首页 | </LI>
</UL>
</DIV>
<DIV class=MODULE id=1>
<DIV class=MODULE_TITLE onMouseDown= "DragStart(event, '1 ') " id=1_Title> <SPAN
class=TITLE_LEFT> ≡商友俱乐部≡ </SPAN> <SPAN class=TITLE_RIGHT> <IMG id=1_Lock title=锁定
style= "CURSOR: pointer " onClick= "ck( '1 ') " height=13 src= "xx论坛_files/unlock.gif "
width=13> <IMG id=1_Size title=最小化 style= "CURSOR: pointer " onClick= "cm( '1 ') "
height=13 src= "xx论坛_files/max.gif " width=13> <IMG style= "CURSOR: pointer "
onclick= "ce( '1 ') " height=13 src= "xx论坛_files/icon_close.gif " width=13>
</SPAN> </DIV>
<DIV class=MODULE_CONTENT id=1_Content>
<DIV class=FORUMLIST_TITLE>
<UL>
<LI style= "PADDING-LEFT: 70px; WIDTH: 65%; TEXT-ALIGN: left "> 论坛 </LI>
<LI style= "WIDTH: 5% "> 主题 </LI>
<LI style= "WIDTH: 5% "> 贴数 </LI>
<LI style= "WIDTH: 9% "> 最后发表 </LI>
<LI style= "WIDTH: 8% "> 版主 </LI> </UL> </DIV>
<DIV class=FORUMLIST>
<UL>
<LI
style= "PADDING-RIGHT: 10px; PADDING-LEFT: 10px; WIDTH: 3%; PADDING-TOP: 4px "> <IMG
title=有新的贴子 height=24 src= "xx论坛_files/forumNew.gif " width=22> </LI>
<LI
style= "PADDING-LEFT: 18px; WIDTH: 62%; TEXT-ALIGN: left "> 『 <B> 网店系统搜索引擎优化(浩维互动支持) </B> 』 <BR> 讨论网店搜索引擎优化经验与技巧,由专业SEO公司浩维互动提供支持;
</LI>
<LI style= "WIDTH: 4%; PADDING-TOP: 2px; TEXT-ALIGN: center "> <IMG height=32
src= "xx论坛_files/icon_1_1.gif " width=32> </LI>
<LI style= "WIDTH: 4%; PADDING-TOP: 10px; TEXT-ALIGN: center "> 0 </LI>
<LI style= "WIDTH: 5%; PADDING-TOP: 10px; TEXT-ALIGN: center "> 0 </LI>
<LI style= "WIDTH: 8%; PADDING-TOP: 10px; TEXT-ALIGN: center "> asdf </LI>
<LI style= "WIDTH: 9%; PADDING-TOP: 10px; TEXT-ALIGN: center "> 管理员 </LI>
</UL>
</DIV>
</DIV>
</DIV>
<DIV class=MODULE id=onLineMember>
<DIV class=MODULE_TITLE onMouseDown= "DragStart(event, 'onLineMember ') "
id=onLineMember_Title>
<SPAN class=TITLE_LEFT> ≡在线人数≡ </SPAN>
<SPAN class=TITLE_RIGHT> <IMG id=onLineMember_Lock title=锁定 style= "CURSOR: pointer "
onclick= "ck( 'onLineMember ') " height=13 src= "xx论坛_files/unlock.gif "
width=13> <IMG id=onLineMember_Size title=最小化 style= "CURSOR: pointer "
onclick= "cm( 'onLineMember ') " height=13 src= "xx论坛_files/max.gif "
width=13> <IMG style= "CURSOR: pointer " onClick= "ce( 'onLineMember ') "
height=13 src= "xx论坛_files/icon_close.gif " width=13>
</SPAN>
</DIV>
<DIV class=MODULE_CONTENT id=onLineMember_Content>
<UL>
<LI style= "MARGIN-LEFT: 10px; TEXT-ALIGN: left "> 紫岩 </LI>
<LI style= "MARGIN-LEFT: 10px; TEXT-ALIGN: left "> 紫岩 </LI>
<LI style= "MARGIN-LEFT: 10px; TEXT-ALIGN: left "> 紫岩 </LI>
<LI style= "MARGIN-LEFT: 10px; TEXT-ALIGN: left "> 紫岩 </LI>
<LI style= "MARGIN-LEFT: 10px; TEXT-ALIGN: left "> 紫岩 </LI>
</UL>
</DIV>
</DIV>
<div id= "forumImage " class= "FORUMIMAGELIST ">
<ul>
<li> <img src= "Images/forumNew.gif " width= "22 " height= "24 " /> 有新的贴子 </li>
<li> <img src= "Images/forumNone.gif " width= "22 " height= "24 " /> 无新的贴子 </li>
<li> <img src= "Images/forumLock.gif " width= "22 " height= "24 " /> 被锁定论坛 </li>
</ul>
</div>
<DIV class=FOOTER> MyWeb.com.cn © 2007 版权所有 不得转载 京ICP证000000号 网络110报警 </DIV>
</BODY>
</HTML>
这一句话“讨论网店搜索引擎优化经验与技巧,由专业SEO公司浩维互动提供支持........................”
老是在外面,这个DIV的样式属性应该怎么样设置???
[解决办法]
上面的代码发给你了,给你改了一下,IE和FF都正常.因为FF下不支持Div随内容自动使用高度,所以.FORUMLIST这个类(就是内容层叠的那个)必须设置一个适当的高度来使用内容
[解决办法]
.MODULE:after {content: ". ";display:block;height:0;clear:both;visibility:hidden;}
*html .MODULE{height:0;}
.MODULE{display:inline-table;}
.MODULE{display:block;}
把这段css加上去,就没有问题了
[解决办法]
在下面加个 clear清理一下浮动
<LI style= "WIDTH: 9%; PADDING-TOP: 10px; TEXT-ALIGN: center "> 管理员 </LI>
</UL>
</DIV>
<br style= "clear:both " />