क्या है: एक इनपुट [प्रकार = चेकबॉक्स] पर छद्म-तत्व अनुमति देने से पहले?

Question

This StackOverflow answer का वर्णन करता है की आवश्यकता के बिना CSS3 का उपयोग कर चेक बॉक्स शैली में एक <label>:

input[type=checkbox]:before { 
    content:""; display:inline-block; width:12px; height:12px; background:red; 
} 

Fiddle

यह क्रोम 22 में काम करता है लेकिन Firefox 15 या आईई 9

में नहीं समर्थन की कमी को देखते हुए बाद के दो ब्राउज़रों में, क्या CSS3 विनिर्देश के अनुसार क्रोम का व्यवहार मान्य है?

Answer 1

यह अनचाहे भूमि है; विनिर्देश चीजों को साफ़ नहीं करते हैं। CSS 2.1 spec says: "नोट। यह विनिर्देशन प्रतिबिंबित तत्वों (जैसे एचटीएमएल में आईएमजी) के साथ पहले और बाद की बातचीत को पूरी तरह से परिभाषित नहीं करता है। भविष्य में विनिर्देशन में इसे अधिक विस्तार से परिभाषित किया जाएगा। "और, दुर्भाग्य से, INPUT को replaced element in CSS 2.1 sense के रूप में देखा जा सकता है।

कोई ऐसा सोच सकता है कि इन छद्म तत्वों का उपयोग उन तत्वों के लिए नहीं किया जा सकता है जिनके पास कोई सामग्री नहीं हो सकती है (यानी, ईएमपीटीई घोषित सामग्री के साथ), जैसे आईएमजी या आईएनपीयूटी। हालांकि, शब्द आईएमजी का उल्लेख करता है, और Appendix D चयनकर्ता br:before के साथ एक नियम है।

और CSS3 चयनकर्ता, CSS3 के कुछ हिस्सों कि सिफारिश स्थिति तक पहुंच चुके से एक है, नहीं स्पष्ट बातें करता है। It says: ":: :: पहले और :: छद्म-तत्वों के बाद किसी तत्व की सामग्री से पहले या उसके बाद जेनरेट की गई सामग्री का वर्णन करने के लिए उपयोग किया जा सकता है। उन्हें सीएसएस 2.1 [सीएसएस 21] में समझाया गया है। "

Answer 2

मुझे लगता है कि क्रोम का व्यवहार अमान्य है। यदि आप take a look here कहते हैं, तो यह ::before और ::after छद्म तत्व लक्ष्य तत्व के content से पहले या उसके बाद नया content जोड़ता है। इनपुट तत्वों में content नहीं है; उनके पास सिर्फ value है। उदाहरण के लिए, आप <input>Pasta</input> नहीं कर सकते हैं।

यदि यह सब सच है, तो ऐसा लगता है कि क्रोम का व्यवहार अमान्य है, जबकि आईई और फ़ायरफ़ॉक्स सही हैं।