"Once you declare a font-family on an element, that declaration stands on its own. The element does not say: I would like 'Open Sans', and if that is unavailable right now, please work your way back up the DOM and inherit whatever fallbacks the nearest ancestor might have."
"If the current element's font-family declaration contains only one value, and that value is not currently available, the browser falls back to its default for that element, and not to an inheritable font-family from somewhere higher up."
Font-family is an inherited property, but once declared on a child element, it becomes self-contained. If a web font is not available, the browser does not fall back to the parent's font stack. Instead, it defaults to a browser-specific fallback. This can lead to flashes of inappropriate text and layout shifts. Developers often misunderstand this behavior, thinking that child elements will inherit fallback options from their ancestors, which is not the case.
Read at Csswizardry
Unable to calculate read time
Collection
[
|
...
]