我正在使用 IE Web 开发人员工具栏来解决问题。列表项下方出现空白,我无法从逻辑上找出原因。使用网络开发工具栏,我看到在下面的示例 1 中,“文本 - Google”下方输出了一个“文本 - 空文本节点”。具有讽刺意味的是,在第二个例子中,在“Google”一词后手动插入空格后,该文本节点不再出现。如果结果相反,那对我来说就完全有意义了。有什么想法可能导致这种奇怪的行为吗?
注意:IE7 中会出现这种情况,IE8 中不会出现这种情况。
<li><a href="www.google.com">Google</a></li> - empty text node appears at end
<li><a href="www.google.com">Google </a></li> - no empty text node
更新:好的,我已经缩小了这个问题的范围。基本上,我正在使用的一些属性之间似乎存在冲突。我需要将 a 标签显示为块,这样当有多行时它们会正确换行。但我也不需要项目之间有任何空白。我不太清楚为什么这个空白空间可以解决问题,并且不希望只是“破解”它。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<style type="text/css">
a
{
display:block;
}
li
{
zoom: 1;
}
</style>
</head>
<body>
<ul>
<li>
<div style="background-color:blue">
<a href="#"><img src="http://www.google.com/intl/en_ALL/images/logo.gif"/></a>
</div>
<ul>
<li style="background-color:Red"><a href="#">One</a></li>
<li style="background-color:green"><a href="#">Two </a></li>
<li style="background-color:Yellow"><a href="#">Three</a></li>
</ul>
</li>
</ul>
</body>
</html>
现在既然<a>
是一个块级元素,你也必须给它hasLayout。
a
{
display:block;
zoom:1;
}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)