Jquery/CSS IE6 问题

Question

这是一个很有趣的问题。基本上我动态地添加了一些 li 标签:

var fileList =  $("#openWin ul");

for (var i = 0; i<20; i++){
  fileList.append("<li>"+i+"<\/li>");
}

我的 li 标签有一些 css:

li{
  list-style : none;
  font-size : 12px;
  margin: 0;
  padding : 5px 10px 5px 10px;
  border-bottom : 1px solid #cccccc;
  font-family : Georgia, serif;
  background-color : white;
  cursor : pointer;
}

这在 IE6 中似乎不起作用。前几个 li 标签似乎没有完全应用 css:

Here is a link to the live file.我尝试为此设置一个 jsFiddle 和 jsBin，但这些站点似乎都无法在 ie6 中正常运行。

奇怪的是，如果我将一些事件添加到 li 标签中，同样的问题也会出现。添加此代码:

 $("#openWin li").live('mouseover', function(){
    $(this).css({"background-color": "#ededed"});
 }).live("mouseout", function(){
    $(this).css({"background-color": "white"});
 });

有效，但前几个 li 标签的行为很奇怪。我将继续努力，任何意见将不胜感激。

Answer 1

看起来像是 hasLayout 问题 - 尝试将 zoom:1 添加到您的 li 样式中。另一种选择是在您要附加的文本中添加一个空格，如下所示:

fileList.append(" <li>"+i+"<\/li>");