CSS for using small caps, text figures etc. font-feature-settings

Credit

This is not so much an article as a handy store of this information for myself. There are specific situations where small caps and text figures are appropriate. For a discussion of that see this excellent article by Dmitry Fadeyev from which this code was extracted for my use. This may not be the best way to do this yet, to quote Dmitry

Browser support for this feature is not yet complete. The above should work in Chrome and Firefox. IE supports it from version 10 upwards. Safari does not support it at this time.

You can use font subsets now, the use of which is explained in Dmitrys article. Of course your font needs to include these for the CSS to work.

.small-caps {
    -ms-font-feature-settings: "smcp";
    -moz-font-feature-settings: "smcp";
    -webkit-font-feature-settings: "smcp";
    font-feature-settings: "smcp";
}

.text-figures { 
    -moz-font-feature-settings: 'onum';
    -ms-font-feature-settings: 'onum';
    -webkit-font-feature-settings: 'onum';
    font-feature-settings: 'onum';
}