Firefox - 從未打開的複選框中刪除邊框

Question

我有一個複選框，其中有appearance: none;。這在Chrome中工作，但在Firefox中，它留下了一個我無法刪除的嵌入邊框。我已經試過border: none。

我在這裏提琴：http://jsfiddle.net/jcJJ5/

Answer 1

不幸的是，它似乎並沒有在設定的複選框的任何屬性會有所幫助。

我發現的唯一簡單解決方法是將複選框包裝在<div>中，並遮住邊框。

查看我的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沒有任何效果。

Answer 2

你可以嘗試設置-moz-箱陰影：有兩行更輕覆蓋暗嵌入火狐創建的顏色...

也，我試過打轉轉的螢火和如果你轉動-moz-appearance：none，複選框就完全正常了，並且有一個你不需要玩的普通樣式。