Edge Browser not loading font-face?

Question

Using the normal CSS font-face does not appear to work properly on the new Windows 10 Edge browser. Works fine on IE11 and all other browsers. Has anyone else seen this? Seems like a bug in the browser.

Here’s the CSS we’ve been using.

@font-face {
    font-family: "Univers";
    src: url("../fonts/univers-webfont.eot");
    src: local(Univers), url("../fonts/univers-webfont.eot"), url("../fonts/univers-webfont.svg"), url("../fonts/univers-webfont.ttf"), url("../fonts/univers-webfont.woff");
    font-weight: normal;
    font-style: normal;
}

.button_black {
    font-family: "Univers";
    font-size: 18px;
    color: @slb-off-black-1;
}

Answer 1

Short Answer

Put quotes around the font name when using the local("Font Name") syntax.

Explanation

"Univers" renders fine in both Edge and Firefox. Your "Please log in..." element, though, is targeting "Univers Condensed", which renders in Edge only if you use local("Univers Condensed") with quotes. That is probably because Edge is more strict that Firefox is. MDN says...

src URL for the remote font file location, or the name of a font on the user's computer in the form local("Font Name"). You can specify a font on the user's local computer by name using the local() syntax. If that font isn't found, other sources will be tried until one is found.

Some Snips

Here are some screen shots that show the problematic CSS and HTML on your site.

Univers Condensed

No Quotes on local()