I would like to add some CSS to my site to access the oldstyle numbers available in the sites typeface. Have tried "font-variant-numeric" without success. I must be doing something wrong. Can you help please.
Are you trying to use the font-variant-numeric property with a custom font you've uploaded or with a Google font loaded from the theme options panel? If you're using a Google font, unfortunately they do not support that property at this time: https://github.com/google/fonts/issues/1335
I don't currently have any CSS code regarding typography. The typeface I have chosen to use has a lot of features that I would like to utilise. I have read that "font-variant-numeric" will give me access to them. I have however not been able to get it to work.
If you're just trying to make use of oldstyle-nums, you could add the following snippet into the custom CSS box located in the Salient options panel > General Settings > CSS/Script related tab:
I would like to add some CSS to my site to access the oldstyle numbers available in the sites typeface. Have tried "font-variant-numeric" without success. I must be doing something wrong. Can you help please.
/Mark
Hi Mark,
Thanks for keeping in touch,
Please allow me to escalate this to the developer to respond further.
Thanks.
Hey Mark,
Are you trying to use the font-variant-numeric property with a custom font you've uploaded or with a Google font loaded from the theme options panel? If you're using a Google font, unfortunately they do not support that property at this time: https://github.com/google/fonts/issues/1335
Kind regards,
Hi,
I want to use the font-variant-numeric property with a custom font.
Can you kindly share the URL and CSS snippet that you're using so that I can take a look?
Thanks in advance
I don't currently have any CSS code regarding typography. The typeface I have chosen to use has a lot of features that I would like to utilise. I have read that "font-variant-numeric" will give me access to them. I have however not been able to get it to work.
URL
https://beta.studiolabbet.se/
Hey Mark,
Have you tried to use the "font-feature-setting" css property to access your font glyphs yet? An example of the method for doing so can be found here: https://stackoverflow.com/questions/54970525/using-a-specific-glyph-with-a-webfont
Kind regards,
I haven't tried that option. And I'm not sure it will give me the right result either. I would simply like to turn on oldstyle numbers.
Hey Mark,
If you're just trying to make use of oldstyle-nums, you could add the following snippet into the custom CSS box located in the Salient options panel > General Settings > CSS/Script related tab:
I've tested to ensure this works by using the browser inspector to add some numbers in the text along with the CSS property: https://www.dropbox.com/s/hhfwm0oricz4iuv/Screen%20Recording%202022-01-17%20at%201.25.09%20PM.mov?dl=0
That is wonderful, many thanks!
Can you help me with making adjustments with the spacing between the letters. I have had a look at "font-kerning", but i'm not sure its exactly right.
Hi There,
Please try this css:
Thanks.