html - Inconsistent selectable area of elements with border-radius -

HTML

  & lt ; div & gt; & lt; / div & gt; & Lt; img src = "http://i.ytimg.com/vi/tntOCGkgt98/maxresdefault.jpg" & gt;  

सीएसएस

<पूर्व> body {background-color: blue; } Div {background-image: url (http://i.ytimg.com/vi/tntOCGkgt98/maxresdefault.jpg); पृष्ठभूमि आकार: कवर; } Div, आईएमजी {चौड़ाई: 100px; ऊँचाई: 100px; सीमा-त्रिज्या: 50%; }

---

आईएमजी

जब कोई छवि पर सीमा-त्रिज्या लागू किया जाता है, तो जो क्षेत्र गोल हो जाते हैं वह अभी भी क्लिक किया जा सकता है पर। यदि आप क्लिक करते हैं और सर्कल के बाहर क्षेत्र खींचते हैं, तो आप देखेंगे कि यह संभव है।

div

हालांकि, जब आप border-radius को लागू करते हैं एक div , गोलाकार क्षेत्र div का हिस्सा नहीं हैं और यह वाकई एक चक्र है।

---

ऐसा प्रतीत होता है यह न केवल लागू होता है से img (वेब-टिकी की टिप्पणी के लिए धन्यवाद)। सीमा-त्रिज्या इन तत्वों पर क्यों लागू नहीं है? क्या कोई ऐसा मानक है जो निर्दिष्ट करता है कि सही व्यवहार क्या है?

क्यों सीमा इन तत्वों पर लागू नहीं होता है?

वेबकिट-आधारित ब्राउज़रों को सीमा-त्रिज्या के आसपास के मुद्दों और जैसे कि img के लिए जाना जाता है , ऑब्जेक्ट और वीडियो तत्व यह स्पष्ट नहीं है कि यह तत्वों के रूप में कुछ अन्य बदले हुए तत्वों के साथ ऐसा क्यों नहीं होता है, लेकिन प्रतिस्थापित तत्व आमतौर पर अधिकांश ब्राउज़रों के साथ एक चिपचिपा बिंदु होते हैं।

ऐतिहासिक रूप से, कुछ ब्राउज़रों ने सामग्री की रूपरेखा , जैसा कि सीमा-त्रिज्या बिल्कुल प्रभावी नहीं था ऐसा लगता है कि वेबकिट / ब्लिंक के हाल के संस्करणों को इसे सुधारने के लिए, लेकिन पूरी तरह से नहीं।

क्या कोई मानक है जो निर्दिष्ट करता है कि सही व्यवहार क्या है?

सही व्यवहार यह है कि प्रतिस्थापित सामग्री को सीमा-त्रिज्या से क्लिप किया जाना चाहिए, और कटा हुआ क्षेत्र पर कोई भी सूचक इवेंट का उपयोग कंटेंट से नहीं किया जाना चाहिए राज्य के पहले दो पैराग्राफ यह बहुत स्पष्ट रूप से है।

यदि क्रिस सीयियर सही है तो प्रतिस्थापित सामग्री कतरन की अनदेखी कर रही है क्योंकि यह कंटेनर का काटा गया है और सामग्री नहीं है (जो वास्तव में है), तो वह है एक कल्पना उल्लंघन और इसलिए एक बग माना जा सकता है।