AJAX/jQuery 和 Chrome 的奇怪行为

Question

我认为检查问题的最好方法是visit它：

打开页面，它应该加载底部的行Alptraum - La Vie Fascinante D'Une Jeune Vierge Effarouchee Marnaise - Unknown Date 感谢这个 jQuery 脚本：

$.ajax ({
    url: "list/browse_ajax.php",
    type: "POST",
    success: function(data) {
        $('#browseList').html(data);
    },
    error: function(data) {
        $('#browseList').html("Error");
    }
});

在服务器上，它回复：

<script type="text/javascript">
    $(document).ready(function() {
        $('.lists').mouseover(function() {
            $(this).css("background-color", "#CCCCCC");
        });

        $('.lists').mouseout(function() {
            $(this).css("background-color", "#FFFFFF");
        });                 
    });
</script>       

<div class="lists">                                 
    <a class="lblackb" href="index.php?explore=view&trackid=888"><?=htmlentities("Alptraum - La Vie Fascinante D'Une Jeune Vierge Effarouchee Marnaise - Unknown Date", ENT_QUOTES, "UTF-8")?></a>
</div>  

使用这个 lists 类：

.lists{width:710px; float:left; border-bottom:1px #000000 solid;}

这是 browseList div：

.content{width:710px; float:left; color:#000000; font-weight:normal; text-align:left; margin-left:13px; margin-right:13px;}    
<div class="content" id="browseList">&nbsp;</div>

但是你怎么看，直到你没有用鼠标继续 div（应用 jQuery mouseover/out 效果），你可以看到整行（至少，当我加载页面时，我只看到一个Vierge Effarouchee Marnaise - Unknown Date 的一小部分。

只有 Chrome (8.0.552.237) 才会发生这种情况

为什么会这样？我该如何解决这个问题？谢谢

附：仅当我在 #browseList' div 中写了 1 行（使用 .html()）时才会发生这种情况。因此，例如，如果我只是在该行之前或之后添加 <br/>，则不会发生这种情况：O

附注 2。我还注意到，如果我多次刷新页面，有时它看起来还可以，有时会出现问题......真的很奇怪！我认为这是一个 Chrome 错误...

Answer 1

我的东西你 div 类 lists 不需要

 float: left; /* delete this line */