Question

div clear: both为何会有高度？

<div style="width:100%; background:url(/images/images_home/daohang_bg.gif); height:32px;">
<div style="width:1002px;">
<div style="width:18px; float:left; height:32px;"><p></p></div>
<div><ul style="list-style: none;display:inline; margin: 0px; padding:0px;">
<li style="background:no-repeat url(/images/images_home/daohang_this.gif); width:128px; float:left; height:32px; padding-top:10px;display:inline;"><span style=" font-size:14px; color:#006600;">OPK首页</span>
</li>
<li style="width:120px; font-size:14px; float:left;height:32px; padding-top:8px;">OPK交友</li>
<li style="width:120px; font-size:14px; float:left;height:32px; padding-top:8px;">OPK交友</li>
</ul></div>

</div>
</div>

<div style="clear: both;height:1px;margin-top:-1px; overflow:hidden;"></div>

//这一行在火狐和GOOGLE浏览器中有高度，要怎么去掉啊？
我只想像清除浮动；

<div style="width:100%; ">
<div style=" width:1002px; text-align:center; margin-top:5px;"><img src="images/images_home/ad_top2.gif" width="966" />
</div>
</div>
<div style="height:0;font-size:0;clear:both;over-flow:hidden;"></div>

换成这样还是不行

Answer 1

错误的位置都没找对，是li样式里面的padding-top的设置问题，在火狐和IE8中，它要加上padding-top的高度，就是32px+10px=42的高度……
解决办法一：在导航菜单最外面那个div添加样式：overflow:hidden;
完整代码为：
<div style="width:100%; background:url(/images/images_home/daohang_bg.gif); height:32px; overflow:hidden;">
<div style="width:1002px;">
<div style="width:18px; float:left; height:32px;"><p></p></div>
<div><ul style="list-style: none;display:inline; margin: 0px; padding:0px;">
<li style="background:no-repeat url(/images/images_home/daohang_this.gif); width:128px; float:left; height:32px; padding-top:10px;display:inline;"><span style=" font-size:14px; color:#006600;">OPK首页</span>
</li>
<li style="width:120px; font-size:14px; float:left;height:32px; padding-top:8px;">OPK交友</li>
<li style="width:120px; font-size:14px; float:left;height:32px; padding-top:8px;">OPK交友</li>
</ul></div>

</div>
</div>

解决方案二：
将li中padding-top的值全部去掉，替换为：line-height:32px;

完整代码为：
<div style="width:100%; background:url(/images/images_home/daohang_bg.gif); height:32px; border:1px solid #000; ">
<div style="width:1002px;">
<div style="width:18px; float:left; height:32px;"><p></p></div>
<div><ul style="list-style: none;display:inline; margin: 0px; padding:0px;">
<li style="background:no-repeat url(/images/images_home/daohang_this.gif); width:128px; float:left; height:32px; line-height:32px;display:inline;"><span style=" font-size:14px; color:#006600;">OPK首页</span>
</li>
<li style="width:120px; font-size:14px; float:left;height:32px; line-height:32px;">OPK交友</li>
<li style="width:120px; font-size:14px; float:left;height:32px; line-height:32px;">OPK交友</li>
</ul></div>

</div>
</div>
如果还有问题，HI我

Answer 2

这个和浏览器有关系的，IE浏览器是没问题的，但部分浏览器这个标签是不起作用的，需要设置下隐藏“overflow:hidden”。
<div style“overflow:hidden; clear: both”>
<p class="left">文本左对齐</p>
</div>

Answer 3

MARGIN: 0px;
padding: 0px;

还加上这个，DIV默认是有高度的