फ़ायरफ़ॉक्स में घुमावदार कोनों: सीमा और पृष्ठभूमि के बीच की जगह

Question

मेरे पास एक div है कि मैं गोलाकार कोनों को लागू कर रहा हूं।

यहां मेरा demo fiddle है।

<div>&nbsp;</div> 

div { 
    margin: 20px; 
    width: 250px; 
    height: 250px; 
    -moz-border-radius: 15px; 
    -webkit-border-radius: 15px; 
    -khtml-border-radius: 15px; 
    border-radius: 15px; 
    background-color: #4c66a1; 
    border: 2px solid #4c66a1; 
} 

मैं भी इस div के लिए लागू एक सीमा और पृष्ठभूमि रंग की है। फ़ायरफ़ॉक्स में समस्या उत्पन्न होती है। सीमा और पृष्ठभूमि के रंग-रंग के बीच सफेद जगह की एक छोटी सी मात्रा है (नीचे छवियां देखें)। यह बहुत ही कम है, लेकिन लोगों ने इसे फिर भी देखा है। यह कोने पर एक प्रकाश प्रभाव की तरह दिखता है।

क्या यह फ़ायरफ़ॉक्स में गोलाकार कोनों के साथ एक ज्ञात मुद्दा है? आईई, क्रोम, और ओपेरा ठीक हैं।

एफवाईआई/इस मुद्दे को दर्शाने के प्रयोजनों के लिए मैंने सीमा और पृष्ठभूमि रंग को समान बना दिया है, भले ही यह अनावश्यक है। यह व्हाइटस्पेस को और अधिक खड़ा करता है।

 Firefox  Chrome/IE/Opera

               

Answer 1

दिलचस्प है, अगर हम इसे बिंदीदार को बदलने के लिए, सफेद चली जाती है:

div { 
    margin: 20px; 
    width: 250px; 
    height: 250px; 
    -moz-border-radius: 30px; 
    -webkit-border-radius: 30px; 
    -khtml-border-radius: 30px; 
    border-radius: 30px; 
    background-color: #4c66a1; 
    border: 2px dotted #4c66a1; 
} 

http://jsfiddle.net/5yAkZ/23/

संपादित अमान्य सीएसएस था पहले से

Answer 2

चेक इस बाहर यह है आप चाहते हैं JsFiddle

<div id='ex1' class='exampleRound'>&nbsp;</div> 

#ex1{ 
    border-radius: 50px; 
    height: 200px; 
    width: 200px; 
} 
.exampleRound { 
    background: none repeat scroll 0 0 #4c66a1; 
    border: 5px solid pink; 
    font-size: 20px; 
    font-weight: bold; 
    margin-bottom: 30px; 
    padding: 20px 40px; 
    margin:20px 
} 

Answer 3

देखें https://bugzilla.mozilla.org/show_bug.cgi?id=704399 जो फ़ायरफ़ॉक्स 11 में तय हो गई है और नए।