Since it's possible to specify lining and oldstyle figures I'm hoping there's browser support for tabular numerals with webfonts?##
Font: Brandon Grotesque
Related: Is there a way to specify the use of text or titling figures in CSS?
Figures, be they lining or oldstyle, can have two different spacing formats: proportional and tabular. Generally speaking, proportional figures are appropriate when numerals are going to be read in text, and tabular figures are preferable when numerals will be read in columns.
Tabular lining numerals have uppercase-like glyphs that take up exactly the same horizontal space. Because of this, they're sometimes referred to as monospaced numerals. Tabular oldstyle numerals—as you might've guessed by now—have lowercase-like glyphs and all of them share a fixed width.
control panel “OpenType”. ➝ Choose “Proportional Lining” if used in copy text. ➝ Choose “Tabular Lining” if used in tables. Note: To save time we recommend to use character styles and paragraph styles that are adapted as set out above.
Lining figures (also called aligning, cap, or modern figures) approximate capital letters in that they are uniform in height, and generally align with the baseline and the cap height. In some traditional typefaces, certain numerals extend slightly above and/or below the baseline and/or the cap height.
Simply, yes.
Presently you can use the attribute "font-feature-settings" in its prefixed forms and add "tnum" to the value list (example) to access tabular numerals in OpenType enabled fonts:
font-feature-settings: 'tnum';
-webkit-font-feature-settings: 'tnum';
-moz-font-feature-settings: 'tnum';
Check caniuse to see if the prefixed versions are still needed.
Note, if you are using Typekit to serve your webfonts, make sure to select "All Characters" under Language Support.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With