ब्राउज़र्स ने ऐतिहासिक रूप से CSS के साथ काम करना दर्दनाक बना दिया है, विशेष रूप से पुराने ब्राउज़र्स में, या बिल्कुल नई प्रयोगात्मक CSS प्रॉपर्टीज़ के साथ होने वाली कई असंगतताओं के कारण। इस समस्या से निपटने के लिए आपको कुछ CSS प्रॉपर्टीज़ पर प्रीफिक्स लागू करने की आवश्यकता होती है ताकि आपका UI सभी ब्राउज़र्स में समान दिखे और काम करे।
एक बेहतरीन उदाहरण CSS फ्लेक्सबॉक्स प्रॉपर्टी है जिसे सभी आधुनिक ब्राउज़र्स के साथ-साथ IE10 और IE11 में काम करने के लिए पूरे 4 प्रीफिक्स की आवश्यकता होती है (जहां फ्लेक्सबॉक्स अभी भी केवल आंशिक रूप से समर्थित है):
display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex;आधुनिक टूल्स आपके निपटान में हैं, आपको प्रीफिक्स टाइप करने की चिंता करने की आवश्यकता नहीं है, वास्तव में, आपको उनमें से किसी को भी याद करने की कोशिश में एक सेकंड भी बर्बाद नहीं करना चाहिए, यह सिर्फ आपके मानसिक संसाधनों की बर्बादी है। इसके बजाय, ऑटोप्रिफिक्सर जैसे टूल का उपयोग वेबपैक या जो भी टास्क रनर/बंडलर आप उपयोग कर रहे हैं उसके साथ करें।
ऑटोप्रिफिक्सर के साथ आपको कभी भी CSS प्रॉपर्टीज़ को प्रीफिक्स करने की चिंता करने की आवश्यकता नहीं है, क्योंकि यह पोस्ट-प्रोडक्शन में आपके लिए सारा काम करता है, इससे पहले कि आप अपने नवीनतम CSS को अपने प्रोडक्शन सर्वर पर पुश करें।
