ऐंकर पोज़िशन के सिंटैक्स में बदलाव

सीएसएस ऐंकर पोज़िशन Chrome 125 में रिलीज़ की गई थी. एपीआई के सार्वजनिक तौर पर उपलब्ध पहले इस वर्शन ने सिंटैक्स के बारे में ज़्यादा चर्चा शुरू की है . उस चर्चा की वजह से, इस सुविधा के लॉन्च होने के बाद से कुछ बदलाव हुए हैं. अगर आपने सीएसएस ऐंकर की पोज़िशन तय करने की सुविधा को पहले ही आज़मा लिया है, तो इस पोस्ट में अपने कोड या ऐंकर पोज़िशन के लिए कॉन्टेंट में किए जाने वाले बदलावों के बारे में बताया गया है.

मुख्य प्रॉपर्टी के दो नाम होते हैं, जिनके बारे में आपको पता होना चाहिए:

  1. inset-area का नाम बदलकर position-area कर दिया गया है. सीएसएस वर्किंग ग्रुप ने नाम बदलने का यह विकल्प चुना है, क्योंकि position- वाक्यांश से आपको यह याद रखने में मदद मिलती है कि यह प्रॉपर्टी, पोज़िशन किए गए एलिमेंट पर लागू होती है, ऐंकर एलिमेंट पर नहीं. यह बदलाव Chrome के 129 वर्शन में शुरू होगा. inset-area, Chrome के 131 वर्शन में काम करेगा, ताकि आपको अपने किसी भी डेमो या लेख को अपडेट करने का समय मिल सके.
  2. position-try-options का नाम बदलकर position-try-fallbacks कर दिया गया है. इस नाम से आपको यह याद रखने में मदद मिलती है कि ये मुख्य पोज़िशन के फ़ॉलबैक हैं, जिन्हें बेस स्टाइल के आधार पर तय किया जाता है. यह बदलाव, Chrome के 128 वर्शन के साथ शिप किया गया है, और position-try-options अब 128 के बाद के वर्शन पर काम नहीं करेगा. हमारा सुझाव है कि आप शॉर्टहैंड (इसे position-try में बदलें) का इस्तेमाल करें. यह Chrome 125 से काम करता है और इसमें कोई बदलाव नहीं किया गया है.

व्यवहार में एक और बदलाव भी होता है:

  • position-try से inset-area()फ़ंक्शनल सिंटैक्स हटाया जा रहा है. इसलिए, position-try-fallbacks: inset-area(top) के बजाय position-try-fallbacks: top का इस्तेमाल करें. यह बदलाव, Chrome के 129 वर्शन पर भी लागू होगा.

ऐंकर पोज़िशन के इस्तेमाल के बारे में यहां ज़्यादा जानें: