On which operating systems or browsers are CSS font-family names case-sensitive

Question

According to sitepoint (a source I typically highly trust) when specifying font-family names some Operating Systems/Browsers may be case-sensitive.

I've typically always used mixed-case values but I'm wondering if lower-case values will work just the same?

I don't have an overwhelming preference either way - but I'd hate for a page to render differently because I typed a lower-case "v" vs. "V" somewhere in a CSS file.

e.g. are there any known cases where 2 divs with the foo and bar classes below would actually render with a different font?

div.foo{
  font-family:Verdana, Arial, Helvetica;
}

div.bar{
  font-family:verdana, arial, helvetica;
}

Answer 1

Although the CSS syntax overview says

The following rules always hold: All CSS style sheets are case-insensitive, except for parts that are not under the control of CSS. For example, the case-sensitivity of values of the HTML attributes "id" and "class", of font names, and of URIs lies outside the scope of this specification. Note in particular that element names are case-insensitive in HTML, but case-sensitive in XML.

The css3-fonts module section mandates case-insensitive comparison:

For other family names, the user agent attempts to find the family name among fonts defined via @font-face rules and then among available system fonts, matching names with a case-insensitive comparison.

so the CSS3 specification requires that font-names be treated case-insensitively.