I think you’re right. The problem is that I need to use a glyph from photoshop that isn’t assigned a unicode value. Is there any way to use this as text? Or does it have to be turned into an svg image?
> On Jul 27, 2016, at 7:15 PM, Philippe Wittenbergh <e...@l-c-n.com> wrote: > > >> On Jul 28, 2016, at 7:05 AM, Sara Haradhvala <har...@comcast.net> wrote: >> >> I set up this unicode in CSS >> >> .menu li::after { >> content: “◆”; >> font-family: athelas, serif; >> font-weight:bold; >> font-size: 16px; >> } >> >> My problem is that the diamond is much bigger in IE and somewhat bigger in >> FF on Windows. > > One guess [*], as I don’t have access to that font (athelas): it does **not** > contain a glyph for the character you want to display, and neither does the > default serif font, then system fallback occurs – that is: Firefox and IE > (Edge also ?) fall back to the default system font that contains that glyph. > That happens to be bigger than the default one on OS X. And who knows what > happens on Android. > > There is not much you can do about it… except specifying a (fallback) font > that is available cross platform (or via @font-face) that contains that > glyph. For example: > > font-family: 'athelas', 'arial unicode MS', sans-serif. // Roboto, the > default on Android, has very similar metrics > > [*] a quick test on fonts.com (the official provider of that font) shows > that, indeed, it does not contain a glyph for that ‘◆’ character. > > Philippe > -- > Philippe Wittenbergh > http://l-c-n.com/ > > > > > ______________________________________________________________________ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/