बग के साथ स्थिति: फ़ायरफ़ॉक्स में फिक्स्ड और बैकफेस विजिबिलिटी

अगले प्रोजेक्ट के लेआउट के दौरान, मैं फ़ायरफ़ॉक्स के नवीनतम संस्करणों में एक अजीब बग में आया, जो बैक-विज़िबिलिटी प्रॉपर्टी का समर्थन करता है। मैंने पहले इस समस्या का वर्णन नहीं देखा है, इसलिए मैंने इसे साझा करने का निर्णय लिया। यह उन सभी के लिए उपयोगी होगा जिन्होंने इस पोस्ट को विंडोज के तहत एंटी-अलियासिंग के बारे में पढ़ा और इन युक्तियों का उपयोग करना शुरू कर दिया।

समस्या का सार

इसलिए, यदि आप वेब फोंट को सुचारू बनाने के लिए उपरोक्त पोस्ट की सिफारिशों का उपयोग करते हैं, तो आपके सीएसएस में निम्नलिखित पंक्तियाँ हैं:

body { -webkit-font-smoothing: subpixel-antialiased !important; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; } 

अब कल्पना कीजिए कि अच्छे फॉन्ट रेंडरिंग के अलावा, आप (या आपका डिज़ाइनर) अचानक किसी तरह के फ्लोटिंग पैनल को प्रोजेक्ट में जोड़ना चाहते थे (हमारे उदाहरण में, सोशल मीडिया आइकन) जो काफी तार्किक रूप से position: fixed का उपयोग करता है position: fixed । ( http://jsfiddle.net/RYCnH/184/ )
किसी कारण से, फ़ायरफ़ॉक्स में यह एक ही पैनल फ़ॉन्ट चौरसाई गुण जोड़ने के बाद "फ्लोट करने से इनकार करता है" और इस तरह स्थित है जैसे कि इसकी स्थिति तय नहीं है, लेकिन निरपेक्ष: http://jsfiddle.net/RYCnH/185/ ।

निर्णय

बात है -moz-backface-visibility: hidden प्रॉपर्टी। हमारे फ़्लोटिंग पैनल के कंटेनर में इसे बदलने पर, हमें वांछित प्रभाव मिलता है: http://jsfiddle.net/RYCnH/186/ ।