4 ms·
No mention of the fact that CSS actually has a mechanism to use OS system fonts? 'caption', 'menu', 'message-box' are all, for example, available system fonts.
by jameshart 11y ago
No mention of the fact that CSS actually has a mechanism to use OS system fonts? 'caption', 'menu', 'message-box' are all, for example, available system fonts.
This is actually a bit of a quirk in the syntax of the CSS 'font' property - http://www.w3.org/TR/CSS21/fonts.html#font-shorthand http://www.w3.org/TR/CSS21/fonts.html#font-shorthand - in that it's not strictly only a shorthand for size/style/family properties, because you can use 'message-box' as a complete font specification, but you can't use '20pt bold message-box'. On the other hand, you can stack 'font: message-box; font-weight: bold; font-size:20px;', so thats not actually a limitation.
Not sure what the browser support situation is, as 'caniuse' and 'quirksmode' haven't dug into the details of support for the CSS 'font' property, but it looks to be doing what you'd expect in chrome on OS X. YMMV.
Looks like this isn't the first time someone's missed this? http://furbo.org/2015/07/09/i-left-my-system-fonts-in-san-francisco/ http://furbo.org/2015/07/09/i-left-my-system-fonts-in-san-fr...
- leephillips 11y agoThese shorthands don't seem to do anything on Chrome/Ubuntu.
- jameshart 11y agoAh. But to be fair, nor will font-family: -apple-system, San Francisco, droid sans, Segoe ui.
- addandsubtract 11y agoHe did add ".SFNSText-Regular"