The site I'm working on only uses about a dozen of the glyphs in the Material Icons font set. Rather than have a >100kB download, I thought I'd use fontsquirrel.com to produce a font file only containing the glyphs I want. So I used the expert settings and put in the unicode values for each glyph I required.
This works when I put the glyphs into the HTML using (what I assume is) HTML-encoded Unicode, e.g.
However, when attempting to use a :before psuedo-class, the glyph can't be found:
.delete:before {
content: '\e872'
}
As you can see, I'm using the codepoint value for the Delete bin icon.
I'm assuming that I've either done something wrong here, or that the font generator is stripping something from the font file that stops the unicode value from being mapped to a glyph. The latter is based on the text representation of each glyph (e.g. "delete") not working either. The former is based on experience.
I've also tried using transfonter.org, but that has the same result.
So, is there a way of getting this to work, or is there an alternative way to do this?
sigh. As expected, user error!
I was reverse-engineering the CSS for a site, and did not spotted that I hadn't specified the font-family for the elements I was using this for.
On the bright side, I do now have a working font that is 4KB instead of 104KB.