Question

div+css 中li外面加超链接 ie6，7兼容性问题

<ul class="main_foot_left">
<a href="#"><li>团购</li></a>
<a href="#"><li>明星店铺</li></a>
<a href="#"><li>最热卖</li></a>
<a href="#"><li>积分商城</li></a>
</ul>

css代码
.main_foot_left{width:245px; margin-top:9px; float:left}
.main_foot_left a:hover li{background-image:none; background-color:#E2E9EF}
.main_foot_left li{line-height:50px; height:50px; background-image:url(../images/bg_write.jpg); color:#044C7E; border:solid 1px #CCC; font-size:22px; padding-left:20px; margin-top:1px;}

在IE6和IE7上面空出一个div高度

Answer 1

不建议用这种写法，太不标准了，ul标签的下一级就应该是li，如果用a标签包含li，是不符合w3c规范的。正确的写法应该是让li包含a，例如下面这样：
<ul class="main_foot_left">
<li><a href="#">团购</a></li>
<li><a href="#">明星店铺</a></li>
<li><a href="#">最热卖</a></li>
<li><a href="#">积分商城</a></li>
</ul>

回到你提出的问题，我在本机用IE7和IE6测试并没有发现什么异常，可能是其他什么地方的样式干扰到了它的表现。如果要调整的话，可以用"*“星号来为IE6/7专门定义样式，例如你发现li的高度在IE6和IE7下表现不对，高度多了20px，就可以这样来定义它的样式
height:50px; *height:30px;

前面的height是所有浏览器都执行的，后面加了星号的height只在IE6/7下面生效。

追问

单单这么写ie6，ie7 也有问题的 我刚试了

追答

是说加了星号也有问题吗?

Answer 2

你按照楼上的格式写
<ul class="main_foot_left">
<li><a href="#">团购</a></li>
<li><a href="#">明星店铺</a></li>
<li><a href="#">最热卖</a></li>
<li><a href="#">积分商城</a></li>
</ul>

还需要给ul和li设置样式：margin：0px；padding：0px
这个样式放在样式表最上面就行，全局都用得到，就不要每个都设置了
ul,li{ list-style-type:none; padding:0px; margin:0px;}

Answer 3

.main_foot_left{width:245px; margin-top:9px; float:left}
你在这里面加上 display:inline; 试下