CSS - 具有背景图像的Firefox中的奇数位置

Question

我创建了一个非常非常好的简单的“复选框”CSS，我现在在我的网站上使用它。它不使用javascript并且非常简洁，它可以在除Firefox之外的所有浏览器中使用。我正在获得用于显示背景图像的div图层的奇怪放置行为......

我准备了jsFiddle来说明这种行为，我们将不胜感激。我真的很困惑什么可能是错的。

jsFiddle Example

我还准备了一个简单的屏幕截图，可以并排显示差异

Answer 1

添加职位：相对于此：

.checkbox input[type="checkbox"] + label { ... }

然后top:0; left:0;：

.checkbox input[type="checkbox"] + label:before { ... }

FIDDLE：http://jsfiddle.net/cfwL3/9/

Answer 2

您需要为top定义position:absolute属性。

.checkbox input[type="checkbox"] + label:before {
   position: absolute;
   left:0px;
   top:0px;
}

演示 http://jsfiddle.net/ciel/cfwL3/