border-box隐藏jQuery动画中的伪元素

Question

我有这个奇怪的问题，申请时不会出现伪元素：

box-sizing:border-box;

测试案例1： http://jsfiddle.net/kGGuP/1/ - 这按预期工作。单击该框将显示内容，它还将显示“箭头”伪元素。

测试案例2： http://jsfiddle.net/XGGg4/ - 我已添加

* {
    -moz-box-sizing:border-box;
    -webkit-box-sizing:border-box;
    box-sizing:border-box;
}

到CSS。如您所见，“箭头”伪元素将不再出现。这将在除Firefox之外的所有浏览器中发生。

除了删除 box-sizing：border-box; 之外，还有其他解决方法吗？我真的不想删除这个规则。

其他信息：

只有 .toggle（）参数和 .slideToggle（）似乎有这个问题。

如果使用 .toggle（）不带参数和 .fadeToggle（），它可以正常工作。

Answer 1

以下是链接http://jsfiddle.net/XGGg4/1/

我在CSS文件中做了一些小改动，检查出你想要的代码

你可以用

*{
    -moz-box-sizing:content-box;
    -webkit-box-sizing:content-box;
    box-sizing:content-box;
}

以上代码也有助于您的代码

Answer 2

查看http://jsfiddle.net/XGGg4/5/

添加

*{
    -moz-box-sizing:border-box;
    -webkit-box-sizing:border-box;
    box-sizing:border-box;
}

真正搞砸你的代码，而不是将box-sizing:border-box;设置为每个元素。这将为你带来魔力。