Firefox - 删除未修饰复选框的边框

我有一个复选框appearance: none;。这在 Chrome 中有效，但在 Firefox 中它留下了一个我无法删除的插入边框。我努力了border: none已经。

我这里有一个小提琴：http://jsfiddle.net/jcJJ5/

不幸的是，在复选框上设置任何属性似乎没有帮助。

我发现的唯一简单的解决方法是将复选框包装在<div>，并模糊边界。

See my Fiddle.

HTML:

<div class="checkbox-container"><input type="checkbox" /></div>

CSS:

input[type="checkbox"] {
    width: 110px;
    height: 110px;
    background: red;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none;
    position: relative;
    left: -5px;
    top: -5px;
}
.checkbox-container {
    position: absolute;
    display: inline-block;
    margin: 20px;
    width: 100px;
    height: 100px;
    overflow: hidden;
}

顺便说一下，（至少在 Firefox 中），设置background没有任何影响。