Um SVG-Schriften mittels der @font-face-Syntax einzubetten, wird bekanntlich folgendes Css benötigt:

@font-face {
	font-family: "Open Sans Regular";
	src: url("../fonts/open-sans-regular/OpenSans-Regular-webfont.svg#OpenSansRegular") format("svg");
}

Spannend ist der Fragmentbezeichner hinter dem Dateinamen, von mir fett hervorgehoben. Normalerweise sollte dieser nämlich in der Schriftdatei noch einmal auftauchen, nämlich als Attributwert für id innerhalb dieses XML-Snippets:

<font id="OpenSansRegular" horiz-adv-x="1171">

Tja. Normalerweise.

Unterscheiden sich der Attributwert und der Fragmentbezeichner, wird die Schrift nämlich nicht geladen und der davorsitzende Frontend-Entwickler kann eine ziemlich lange Zeit damit verbringen, diesen Fehler zu finden…

Links

Quick Tip: SVG Fonts & @font-face