Re: [css-d] rendering of icon in Windows browsers

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

Re: [css-d] rendering of icon in Windows browsers

> On Jul 28, 2016, at 12:21 PM, Sara Haradhvala wrote: > > 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? That

Re: [css-d] rendering of icon in Windows browsers

Hi Sara, I think you're meaning this? No it does not have to be a svg. .menu li::after { font-family: 'athelas', serif; font-weight:bold; font-size: 16px; content: url('diamond.png'); } Best, Karl DeSaulniers Design Drumm http://designdrumm.com > On Jul 27,

Re: [css-d] rendering of icon in Windows browsers

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 wrote: > > >> On

Re: [css-d] rendering of icon in Windows browsers

> On Jul 28, 2016, at 7:05 AM, Sara Haradhvala 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

Re: [css-d] rendering of icon in Windows browsers

Hi Sara, What does your @font look like? Does athelas not have quotes around it? I have found that simply adding '' (single quote) in the @font and font-family helps on IE and FF when using custom fonts. .menu li::after { font-family: 'athelas', serif; font-weight:bold;

[css-d] rendering of icon in Windows browsers

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. All looks good on Mac browsers and Chrome on