一个在firefox下异常的li显示问题,在IE7\8等版本都显示正常

时间:2022-01-23 08:29:04
一个在firefox下异常的li显示问题,在IE7\8等版本都显示正常
栏目七莫名的会对不齐,真是百思不得其解呀

<!DOCTYPE html>
<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">
/* CSS Document */
* { margin: 0; padding: 0; }
body { font-family: "Microsoft Yahei", Verdana;}/* font-family:Microsoft Yahei*/
li { list-style-type: none; }
.f12 { font-size: 12px; }
.f14 { font-size: 14px; }
.fWeight{ font-weight: bolder; }

/*链接根据页面要求全局自定义*/
a { text-decoration: none; color: #666; }
a:hover { color: #00A57E; }
/*链接绿色*/
.width1020{ width: 1000px; margin-right: auto; margin-left: auto; padding-right: 10px; padding-left: 10px; }
#nav { border-top-width: 1px; border-bottom-width: 1px; border-top-style: solid; border-bottom-style: solid; border-top-color: #ddd; border-bottom-color: #ddd;}
#nav ul { line-height: 0px; height: 24px; margin-top: 12px;margin-bottom: 12px; background-color: #FF80C0; }
#nav li { font-family: "Microsoft Yahei",Verdana; float: left; padding-left: 35px; line-height: 24px; height: 24px; margin-left: 25px; margin-right: 20px; background-color: #FFFF80; }
</style>
</head>
<body>
<div id="nav" class="width1020">
  <ul class="f14 fWeight">                                           
    <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>
</body>
</html>


7 个解决方案

#1


这么诡异的问题不会就我一个人遇到吧

#2


我也遇到过 一个在firefox下异常的li显示问题,在IE7\8等版本都显示正常

#3


造成这样的原因,通常是文本节点造成的
一个在firefox下异常的li显示问题,在IE7\8等版本都显示正常
哦了,结贴给分

#4


你把你粘贴出来的代码再复制回去看看,就没有问题,就如楼上所说是空格导致的

#5


顶三楼 一个在firefox下异常的li显示问题,在IE7\8等版本都显示正常

#6


把#nav li中的 margin-right: 20px; 去掉, margin-left: 25px;改为 44px。。。 但是如果改为45px也会出现你那种情况。。

#7


引用 3 楼 perhapschen 的回复:
造成这样的原因,通常是文本节点造成的
一个在firefox下异常的li显示问题,在IE7\8等版本都显示正常
哦了,结贴给分
果然,晕死,在DW软件下压根 看不到这空格符,浏览器源码查看也没看出

#1


这么诡异的问题不会就我一个人遇到吧

#2


我也遇到过 一个在firefox下异常的li显示问题,在IE7\8等版本都显示正常

#3


造成这样的原因,通常是文本节点造成的
一个在firefox下异常的li显示问题,在IE7\8等版本都显示正常
哦了,结贴给分

#4


你把你粘贴出来的代码再复制回去看看,就没有问题,就如楼上所说是空格导致的

#5


顶三楼 一个在firefox下异常的li显示问题,在IE7\8等版本都显示正常

#6


把#nav li中的 margin-right: 20px; 去掉, margin-left: 25px;改为 44px。。。 但是如果改为45px也会出现你那种情况。。

#7


引用 3 楼 perhapschen 的回复:
造成这样的原因,通常是文本节点造成的
一个在firefox下异常的li显示问题,在IE7\8等版本都显示正常
哦了,结贴给分
果然,晕死,在DW软件下压根 看不到这空格符,浏览器源码查看也没看出