You led me to the right solution - thanks for letting me know that I wasn’t
using the right character.
The actual Athelas character did not have unicode. I found out I could access
it by using a regular text character and transforming it with
"font-feature-settings".
> 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/
