CSS懸停只在Firefox上運行

Question

CSS懸停只能在Firefox瀏覽器，不要在Chrome和IE的工作，這是我的代碼

HTML

<li><input type="checkbox" class="p4" name="i305" id="check305" /><label for="check305"><span></span></label></li> 
<li><input type="checkbox" class="p4" name="i306" id="check306" /><label for="check306"><span></span></label></li>   
<li><input type="checkbox" class="p4" name="i307" id="check307" /><label for="check307"><span></span></label></li> 

CSS

input.p4[type="checkbox"] { 
    display:none; 
} 
input.p4[type="checkbox"] + label span { 
    display:inline-block; 
    width:20px; 
    height:19px; 
    margin:-6px 0 0 0; 
    vertical-align:middle; 
    background:url(../images/check1.png) 1px top no-repeat; 
    cursor:pointer; 
} 
input.p4[type="checkbox"]:hover + label span { 
    background:url(../images/check1.png) -21px top no-repeat; 
} 
input.p4[type="checkbox"]:checked + label span { 
    background:url(../images/check1.png) -43px top no-repeat; 
} 

任何人都可以幫我做懸停CSS的功能嗎？

Answer 1

的:hover應該被施加到標籤，而不是該複選框（因爲所以它不能被徘徊不可見..）在http://jsfiddle.net/gaby/rkbeK/

---

input.p4[type="checkbox"] + label:hover span { 
    background:url(../images/check1.png) -21px top no-repeat; 
} 

工作實施例（更多信息請參見Why is hover for input triggered on corresponding label in CSS?）