HTML में दशमलव बिंदुओं को संरेखित करना: प्राथमिक समाधानों से परे

हालांकि HTML तालिकाओं में दशमलव बिंदुओं को संरेखित करने का प्रश्न मामूली लग सकता है, लेकिन यह सिद्ध हो चुका है वेब डेवलपर्स के लिए चुनौतीपूर्ण। दो सामान्य दृष्टिकोण, HTML तत्वों का उपयोग करके संख्याओं को विभाजित करना या HTML4 col ign='char' विशेषता को नियोजित करना, की सीमाएँ हैं।

हालाँकि, एक अधिक सुरुचिपूर्ण और कुशल समाधान मौजूद है जिसे यूनिकोड वर्ण 'फिगर स्पेस' के रूप में जाना जाता है। ( ). इस व्हॉट्सएप वर्ण में अंकों के समान चौड़ाई होने और इसके अंतर को बनाए रखने की अनूठी संपत्ति है। बाईं ओर आकृति रिक्त स्थान के साथ पैड नंबर। दाएं-संरेखण के लिए, दाईं ओर आकृति रिक्त स्थान के साथ पैड नंबर।

/* दशमलव बिंदुओं को बाएं-संरेखित करें */ ।बाएं संरेखित { पाठ-संरेखण: बाएँ; पैडिंग-दाएं: .5रेम; फ़ॉन्ट-फ़ैमिली: सैन्स-सेरिफ़; } /* दशमलव बिंदुओं को दाएँ संरेखित करें */ .दाएँ-संरेखित { पाठ-संरेखण: दाएँ; पैडिंग-बाएँ: .5rem; फ़ॉन्ट-फ़ैमिली: सैन्स-सेरिफ़; }

/* Left-align decimal points */
.left-aligned {
  text-align: left;
  padding-right: .5rem;
  font-family: sans-serif;
}

/* Right-align decimal points */
.right-aligned {
  text-align: right;
  padding-left: .5rem;
  font-family: sans-serif;
}

  10000

    123.4

      3.141592



  10000

    123.4

      3.141592

चित्रा रिक्त स्थान सभी प्रमुख ब्राउज़रों द्वारा समर्थित हैं, जो उन्हें HTML में दशमलव बिंदुओं को संरेखित करने के लिए एक मजबूत और क्रॉस-प्लेटफ़ॉर्म समाधान बनाता है।