slideUp和slideDown导致Firefox 12中的文本跳转？

Question

我的代码如下：

$(function(){

    $("#ani").slideUp(600,function(){
         $(this).text('13').slideDown(600);        
    });
})

HTML代码如下：

<div>Comment: <span id="ani">12</span></div>

加载页面后，幻灯片会影响Comment:文字。 I have written this code in jsFiddle and you can watch it there. 问题是什么。我为外部div写了display和height css属性，但没有成功;（

Answer 1

像下面这样的东西应该这样做。 div应具有标准宽度，内部跨度为float: right

<div>Comment:
    <span id="ani">12</span>
</div>​

CSS

div{width:100px;}
span{float:right;}

DEMO

希望这有帮助

修改

此更新基于OP的答案：

<div><span>Comment:</span>
    <span id="ani">12</span>
</div>

<强> CSS

span{float:left;display:inline-block;min-height:30px;}

Answer 2

问题已经解决了！你可以看到the output in jsFiddle 谢谢@Dhiraj_Bodicherla，您的帮助解决了问题+1。我实际上需要将注释浮动到左侧，如下所示：

<div><span style="float:left;display:inline-block;min-height:30px;">Comment:</span>
    <span id="ani">12</span>
</div>

jQuery部分：

$(function(){

    $("#ani").slideUp(600,function(){
         $(this).text('13').slideDown(600);        
    });
})

除了这些代码之外别无其他。