मुझे एक ही समस्या मिली है लेकिन अलग-अलग संदर्भ में, तो हो सकता है कि यह वेब-बिट-बैकफ़ेस-विज़िबिलिटी के साथ कोई समस्या न हो लेकिन चीजों के कई संयोजनों के साथ। मेरे मामले में समस्या तब उत्पन्न होती है जब रेडियो बटन वाले पृष्ठ में Google मानचित्र जैसे मानचित्र होते हैं (एक प्रॉपर्टीरी, मुझे नहीं पता कि मानचित्र में वास्तव में समस्या का कारण क्या है) और आईफ्रेम के अंदर प्रदर्शित होता है। यदि मैं इंस्पेक्टर के साथ मानचित्र छुपाता हूं तो रेडियो बटन ठीक दिखते हैं, या यदि मैं सीधे पृष्ठ को देखता हूं, तो iframe के अंदर नहीं।
मैंने पाया है कि एकमात्र कामकाज इस पृष्ठ में सीएसएस निंजा से है: http://www.thecssninja.com/css/custom-inputs-using-css।
सारांश में, इस समाधान है (एक लाइव डेमो पृष्ठ से जुड़े मैं उल्लेख किया है, http://www.thecssninja.com/demo/css_custom-forms/ है):
एचटीएमएल
<label for="input1" class="radio_image">
<input type="radio" name="input" id="input1" />
<span>Option 1</span>
</label>
सीएसएस
/*we hide the real radio button*/
.radio_image input[type=radio] {
position:absolute;opacity:0;
}
/*we assign the span a background image
which is a capture of the actual radio button*/
.radio_image input[type=radio] + span {
background-image: url("radio-button.gif");
background-position: left top;
background-repeat: no-repeat;
padding-left: 1.6em;
}
/*if radio is checked we change the background
image to one with a checked radio button (it can be
done with a sprite type background too): */
.radio_image input[type=radio]:checked + span {
background-image: url("radio-button-checked.gif");
}
जैसे ही अवधि लेबल के अंदर है, उस पर क्लिक करने से सीएल के समान प्रभाव होगा रेडियो बटन पर खुद को लात मारना, इसलिए रेडियो बटन अभी भी ठीक काम करता है।
मैं एक विकास वातावरण में काम कर रहा हूं इसलिए मैं आपको यूआरएल पोस्ट नहीं कर सकता, लेकिन ऊपर दिए गए कोड और लिंक के साथ मुझे लगता है कि यह देखना आसान है। Can you target Google Chrome?
मुझे आशा है कि यह मदद करता है,, मैं बस एक साधारण रेडियो बटन प्रस्तुत करना इस तरह के एक जटिल तरीके पसंद नहीं है:
तुम सिर्फ क्रोम को लक्षित करना चाहते हैं, तो आप समाधान इस पोस्ट में प्रदान की कोशिश कर सकते हैं मेरे मामले में मैंने इसे केवल उसी पृष्ठ में उपयोग किया है जिसमें मेरी साइट में समस्या है और यह ठीक काम करता है।
मैं एक साइट मैं के कुछ संवाद में कुछ नहीं बल्कि सभी बटन और रेडियो बटन पर इसी तरह की समस्याओं को देखा है काम पर। नो-वेबकिट-बैकफेस-दृश्यता शामिल है। मेरे पास मेरी साइट में कई * बहुत * समान संवाद हैं; विचित्र रूप से, उनमें से कुछ को यह समस्या है और कुछ नहीं करते हैं। मुझे डर है कि मैं जो काम कर रहा हूं वह यहां पोस्ट करने के लिए बहुत जटिल है, और अभी भी विकास में है इसलिए मैं सिर्फ एक लिंक प्रदान नहीं कर सकता। लेकिन यह जानना उचित है कि इसका संभवतः -वेबिट-बैकफेस-दृश्यता के साथ कुछ लेना देना नहीं है, और बटन और साथ ही रेडियो बटन को भी प्रभावित कर सकता है। वे आम तौर पर घुमावदार किनारों पर है। –
("बहुत ही समान संवाद" से, मेरा मतलब है कि मूल पोस्टर के लिए नहीं, एक दूसरे के समान) –