محاذاة النقاط العشرية في HTML: ما وراء الحلول الأولية

في حين أن مسألة محاذاة النقاط العشرية في جداول HTML قد تبدو تافهة، فقد ثبت تحديًا لمطوري الويب. هناك طريقتان شائعتان، تقسيم الأرقام باستخدام عناصر HTML أو استخدام سمة HTML4 col align='char'، لهما قيود.

ومع ذلك، يوجد حل أكثر أناقة وفعالية يُعرف باسم حرف Unicode 'FIGURE SPACE'. ( ). يتمتع حرف المسافة البيضاء هذا بخاصية فريدة تتمثل في كونه بنفس عرض الأرقام والحفاظ على تباعدها.

الاستفادة من مسافات الأشكال للمحاذاة

لمحاذاة النقاط العشرية إلى اليسار، ما عليك سوى القيام بذلك أرقام اللوحة مع مسافات الشكل على الجانب الأيسر. للمحاذاة إلى اليمين، أرقام اللوحة مع مسافات الشكل على الجانب الأيمن.

/* 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

التحكم المحسّن في المحاذاة