How to use the tabular number alignment guide
Numbers that shift left and right from row to row are hard to compare. Two things cause it: digit glyphs with different advances, and ragged digit counts. This tool turns your digit counts, separators and symbol cells into the minimum width a column needs in px, and writes the CSS that carries tabular-nums and right alignment.
The width is (digit cells x digit advance + separator cells x separator advance) x font size + padding x 2. The separator count is floor((integer digits - 1) / 3), and a decimal point adds one more separator cell. The longest value is built from the same counts and shown alongside. Written as of October 2026.
Digit advances differ per font, so that is an input. The comma and point advance is outside what tabular-nums equalises, so it is a separate input, and leaving it blank is reported as an assumption in the result. Measuring glyph advances automatically, minus signs or parentheses for negatives, and wrapping of unit suffixes are not covered, so confirm the final width in your real table.
Frequently Asked Questions
Digits share one advance, so a column with a fixed number of digits stops shifting. Commas and points are not covered, and ragged digit counts still leave the ends misaligned, so fixing the digit count and aligning right is the dependable route.
Fix the number of decimal places and align right, and the points line up. Character-based alignment, text-align: ".", is in the spec but is not widely supported, so it is hard to rely on as the main method.
Subtract one from the integer digit count, divide by three and take the floor. Four digits give one separator, six digits give one, and seven digits give two. The formula and the count are printed in the result table.